- Home /
how can i show number of lives as hearts (or other image) during gameplay
hello all,
this is probably really simple but i can't seem to figure it out. i have a script for lives which adds a life after a delay of two seconds. when the total of lives amount to 5, then the game is over. the script works fine, but i would like to represent the number of lives as hearts on the screen during game runtime, instead of showing a number on the screen. so if the game-lives = 4 i would like four hearts to appear in a line.. i'm not quite sure how to get this implemented. can someone please guide me to the process of doing this? this is a 2d game.
thanks in advance.
Answer by Zepeck · Mar 21, 2014 at 08:54 PM
I dont know what language yor doing this in so ill do some pseudo-code.
if (lives == 1)
display "heart" at (some coordinates)if (lives == 2) display "heart" at (some coordinates) display "heart" at (some coordinates)
if (lives == 3) display "heart" at (some coordinates) display "heart" at (some coordinates) display "heart" at (some coordinates)
etc.
If you want it more language specific, just tell me what language your using.
Answer by robertbu · Mar 21, 2014 at 07:45 PM
And here is yet a another solution. To test
In a new scene attach the following script to an empty game object.
Add the following texture to your project (or create your own similar texture).
Select the game object in the hierarchy with the script attached, and drag and drop the texture on the 'tex' variable.
You can change the lives variable in the inspector as the app is running to change the number of hearts.
#pragma strict
var tex : Texture;
var lives = 3;
private var texWidth : float;
private var texHeight : float;
function Start() {
texWidth = tex.width;
texHeight = tex.height;
}
function OnGUI() {
if (lives > 0) {
var posRect = Rect(50,50,texWidth / 5 * lives, texHeight);
var texRect = Rect(0,0,1.0 / 5 * lives, 1.0);
GUI.DrawTextureWithTexCoords(posRect, tex, texRect);
}
}
I see how this works, and it is pure genius. Only show a portion of the texture depending on the number of lives. OnGUI though.
@Dblfstr - Same thing can be done using a world Quad and $$anonymous$$aterial.SetTextureScale(). I was looking to give him a solution that only had a single draw call.
I have seen you answer many questions here. So your solution is probably more optimized than $$anonymous$$e. That being said, what do YOU think of my solution above? Is that a practical way (sorry for asking questions in the comments) to achieve this?
@Dblfstr - the best code is always code we understand and can modify ourselves. While we should pay attention to performance, often with Unity the issues are not what we think and early performance choices don't really matter. So no matter what someone says, keep code that you can manipulate. Some comments about your code:
You may have to jump through some hoops if the camera is mobile and/or it is a perspective game since you implement it using world objects.
You have to use author and have in memory 5 sprites ins$$anonymous$$d of just one.
Sprites are new, and I don't know the performance implications of using them this way.
Your code can be simplified:
if (gameLives <= 0) {
heartHolder.sprite = null;
}
else {
heartHolder.sprite = hearts[gameLives-1];
}
If Unity isn't smart, there may also be overhead in setting the sprite every frame rather than only when gameLives change. It would be worth do a bit of checking if you were going to use this code.
Answer by Ado · Mar 21, 2014 at 07:31 PM
How I do it:
void OnGUI(){
Rect r = new Rect(0,0, screen.width, screen.height); //Adjust the rectangle position and size for your own needs
GUILayout.BeginArea(r);
GUILayout.BeginHorizontal();
for(int i = 0; i < lives; i++)
GUILayout.Label(heartTexture); //assign your heart image to this texture
GUILayout.FlexibleSpace();
GUILayout.EndHorizontal();
GUILayout.EndArea();
}
This is a good method as well. I just avoid OnGUI like the plague.
Answer by Dblfstr · Mar 21, 2014 at 07:39 PM
How I do it:
public SpriteRenderer heartHolder;
/*Drag your heart sprites here in the Inspector
You will need a sprite for 1 heart, two hearts, three hearts, etc.
Place them in order from one heart - highest number of hearts. */
public Sprite hearts[];
void start(){
//Grab the SpriteRenderer of this component
heartHolder = this.getComponent<SpriteRenderer>; //Something like that
}
void Update(){
/*Maybe make a bool here to
check if the lives have changed */
switch(gameLives){
case 1: {
heartHolder.sprite = hearts[0];
break;
}
case 2:{
heartHolder.sprite = hearts[1];
break;
}
case 3:{
heartHolder.sprite = hearts[2];
break;
}
case 4:{
heartHolder.sprite = hearts[3];
break;
}
case 5:{
heartHolder.sprite = hearts[4];
break;
}
default: {
heartHolder.sprite = null;
break;
}
}
}
I do the same thing for keeping score (took forever to figure out!) Number of stars you get for completing a level (1 -3), lives, etc. Once I figured it out, I use this method all over the place. The best part, I can keep all sprites on a sprite sheet so my Draw Calls for all GUI stuff is only 1.
Your answer
![](https://koobas.hobune.stream/wayback/20220613140831im_/https://answers.unity.com/themes/thub/images/avi.jpg)
Follow this Question
Related Questions
Touch are laggy on ipod touch(4th gen.) 0 Answers
Toggle Only Works Once 1 Answer
How to fix it? 0 Answers
GUI Button not displaying an icon 3 Answers
Working around Texture2D.Apply() performance issue 0 Answers