10 Heart - Life System

Hi,

I thought I would be able to tackle this one by myself but for some reason I just cant wrap my head around it.

I have 10 hearts in Canvas.

1 heart = 10
1/2 a heart = 5

I cant seem to get them to enable the disabled heart image

This is what I have at the moment…

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class life_system : MonoBehaviour {

    public Image[] hearts;

    public Text lifeText;
    public int life;

    public int maxLife;//Variable so we can change if we want to (special item for more life?)

    void Start ()
    {
        life = 50;
        maxLife = 100;
    }

    void Update ()
    {
        lifeText.text = ("LIFE: " + life + "/100");//Display life Text

        if (life <= 0)//Stop life from going less that 0
        {
            life = 0;//Sets life to 0
        }

        if (life >= 100)//Stop life from going higher than 100
        {
            life = maxLife;//Sets life to 100
        }

       
        //TEMP life control keys
        if (Input.GetKeyDown(KeyCode.DownArrow))
        {
            life -= 5;
        }
        if (Input.GetKeyDown(KeyCode.UpArrow))
        {
            life += 5;
        }

        Hearts();
    }

    public void Hearts()
    {
        if (life == 0)
        {
            foreach (Image h in hearts)
            {
                h.enabled = false;
            }
        }

        if (life >= 10)
        {
            hearts[0].enabled = true;
        }

        if (life >= 20)
        {
            hearts[1].enabled = true;
        }

        if (life >= 30)
        {
            hearts[2].enabled = true;
        }

        if (life >= 40)
        {
            hearts[3].enabled = true;
        }

        if (life >= 50)
        {
            hearts[4].enabled = true;
        }

        if (life >= 60)
        {
            hearts[5].enabled = true;
        }

        if (life >= 70)
        {
            hearts[6].enabled = true;
        }

        if (life >= 80)
        {
            hearts[7].enabled = true;
        }

        if (life >= 90)
        {
            hearts[8].enabled = true;
        }

        if (life == 100)
        {
            hearts[9].enabled = true;
        }
    }
}

First of all calling Hearts() every frame is a waste of resources. You should do it only when player takes damage or heals.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class life_system : MonoBehaviour {

    public Image[] hearts;

    public Text lifeText;
    public int life;
    float lifeIn1Heart;
    public int maxLife;//Variable so we can change if we want to (special item for more life?)

    void Start ()
    {
        life = 50;
        maxLife = 100;
        lifeIn1Heart = maxLife / hearts.Length;
    }

    void Update ()
    {
 
        //TEMP life control keys
        if (Input.GetKeyDown(KeyCode.DownArrow))
        {
            life -= 5;
        }
        if (Input.GetKeyDown(KeyCode.UpArrow))
        {
            life += 5;
        }

        Hearts();
    }

    public void Hearts()
    {
        life = Mathf.Clamp(life, 0, maxLife);//Stop life from going less that 0 and from going higher than 100
        lifeText.text = ("LIFE: " + life + "/100");// string concatenation is bad for performance. You should have 3 different texts to avoid it.

        for(int i = 0; i < hearts.Length; i++){
            bool showHeart = life > i * lifeIn1Heart;
            hearts[i].enabled = showHeart;
        }
    }
}

Thanks for the reply!

I see! Thanks dude! Just one last question, how would I implement half a heart images? So it goes from a whole heart to half a heart then empty?

At the moment I am decrees and increases the heart by 10 which works with the whole hearts, however I want to decrees and increase by 5 so I can include a half of a heart.

Dean

Just use 2 sprites instead of 1 for a heart. One is lower part and the other is upper part.

1 Like

Thanks a lot! It worked, much appreciated!

You could maybe use a grey heart image, and a red heart image.
You put the red over the grey, and set the red one Image Type to “filled”. Then, using a float you can modify the red heart, and make it half a heart, you could also make it a quarter of an heart, 15% or an heart, even 17.73% of an heart, depending on how you want to handle it.

Instead of using if statements to check how much hearts will be displayed, you could divide your amount of hp by ten.

1 Like