Zelda Style Life System Unity Tutorial - Part 10 of 10

Zelda Style Life System Unity Tutorial - Part 10 of 10

The end result of the full tutorial.

At the end of Part 10 we will have produced this (See image 1.0).

Image 1.0

Before you start you should know these things:

You should have gone through and completed ‘Part 9’ of this tutorial before going any further. If you find yourself not understanding some of the terminology or code of the tutorial I would also recommend going through the previous tutorial to get up to speed. I will leave a link to it below to go through at your leisure.


http://joseph-easter.blogspot.com/2016/09/zelda-style-life-system-unity-tutorial.html

If you follow this tutorial and find I am moving too fast or if you don’t know the things in the list above, I would recommend getting up to speed and then come back to this tutorial when you are ready.

Links to Parts 1 - 10 of this tutorial series:

Part 1

Part 2

Part 3

Part 4

Part 5

Part 6

Part 7

Part 8

Part 9



With this tutorial if you want to convert this into JavaScript by all means do so but it may be easier for you to follow this in C# and stick with the language of the tutorial to make it easier.

PROJECT RESOURCES: At the bottom of the post there is a download link to a zip file. This files includes all files needed to follow Part 10 and the completed project file of Part 10.

In this part we will work on polishing what we have by adding more detail and flexibility to the system.
We will: 

• Make quarter health show when heart is nearly empty
• Adjust a few parameters
• See our finished code in action

Step 1: – Showing the Quarter Health Image

When we finished Part 9 we fixed most of the bugs, however we were left with one thing to sort out. Thanks to how the List for lifeImages works, when the player has a little bit of health left (a quarter or less), the system shows an empty heart image. This is not accurate and not what we want to happen, it happens thanks to a logical error (not something the compiler reports). We only want the empty heart to show when there is zero health in that heart.

This is quite a simple fix. The way we do this is by checking if the ‘lifeImagesIndex‘ is zero and ‘currentLifeHealth’ is greater than zero. Then we set the ‘lifeImagesIndex’ to one if the condition is met.

Code:

private void UpdateLives()
{
  bool restOfLivesAreEmpty = false;
  int i = 0;
  foreach (Image life in livesArray)
  {
    if (restOfLivesAreEmpty)
    {
      life.GetComponent<Image>().sprite = lifeImages[0];
    } else {
      i +=1;
      if (currentHealth >= i * healthPerLife)
      {
        life.GetComponent<Image>().sprite = 
                               lifeImages[lifeImages.Length - 1];
      } else {
        int currLifeHealth = (int)(healthPerLife – 
                                  (healthPerLife * i – 
                                   currHealth));
        int healthPerLifeImg = healthPerLife / lifeImages.Length;
        int lifeImagesIndex = currLifeHealth / healthPerLifeImg;
        if (lifeImagesIndex == 0 && currentLifeHealth > 0)
        {
          lifeImagesIndex = 1;
        }
        life.GetComponent<Image>().sprite = 
                                     lifeImages[lifeImagesIndex];
        restOfLivesAreEmpty = true;
      }
    }
  }
}


Now when we run the code we will get this. (See figure 1.0)

Figure 1.0.

Step 2: – Adjusting a few properties

Now you may have noticed that if we click the ‘Take Some Damage’ button, if we click it once the health decreases by one in the console but the heart graphic stays the same. If we click it two more times, then it shows a three quarter full heart instead of a full heart. This is just how the logic works. Each time we are only removing one health, and each heart image (e.g. full, quarter and so on) represent two health. In order for the heart image to change each time we ‘Take Some Damage’ we need to increase the amount of damage to at least three. (See Figure 1.1).

Figure 1.1

When we enter 'Play' mode and take some damage the sprite image used for 'lifeImg' now changes (Figure 1.2), and when there is still a little bit of life left our code fully works (figure 1.3).

Figure 1.2 left, figure 1.3 right.

Step 3: – Adding a few finishing touches

Great our Life system is nearly finished. All we need to do now is add a few finishing touches and we are done. In this step we will add a ‘Heal Me’ button. This is very simple, we will create another button and make it modify our health by adding six to ‘currentHealth’. Then you can use this in your game.

The first thing to do is create a new button from the ‘Create’ menu and give the the same width and height as the first two buttons (or you can duplicate the ‘Take Some Damage’ button). Then position it beside the ‘Take Some Damage’ button (to the right of it), name rename the button to ‘Heal 6 Damage Btn’ and change the ‘Text’ label to say ‘Heal Me’. (For an example see figure 1.4 below)

Figure 1.4.

Here the ‘Heal Me’ button is positioned at X: 163.1, Y: 47 and Z: 0.

After this go down to the button script, there should be an ‘enum’ dropdown menu that reads ‘LifeSystem.ModifyHealth’. Under this there should be an ‘int’ field. In here enter ‘6’ with out an ‘-‘ (see figure 1.5). This will add health to the player when they make some damage but will not go any higher than the ‘maxLives’ variable.

Figure 1.5.

Interactive Demo – End Result

[insert link to web player]

Great, Part 10 is finished.

We have learnt how to:

• Fix the logical error (show a quarter heart instead of empty heart when there’s a little health left)
• Tweak ‘Take Damage’ parse value to show health depleting correctly
• How to heal the player using ‘Modify Health’ and not exceed the ‘maxLives’ variable

Great, you have completed the whole tutorial. Thanks for taking the time to follow the entire way through. We have learnt a lot along the way. If you liked this tutorial leave a comment below telling me why you like it and share it with a friend who will find it useful. If you didn’t like it, please leave a comment below saying why.

If you would would like to see more of these tutorials, please leave a comment below. And if you want more of this particular tutorial say what you want to see more of in the comments.

Download resources and project files.