Creating the additional UI elements

The first part of the UI that I wanted to create are the player health and Energy.

I started by creating an image of which I used a rectangle and change it’s color to red, duplicated it and put the duplicated rectangle a layer behind so it stays in plays and will never overlap so this is a backing layer to help indicate how much health is missing, then duplicated it for a third time and changed it to black with an even lower layer than the last one and expanded it a little which gives a nice boarder around the health bar.

I then duplicated and shrunk it down then turned the main layer to yellow which represents the players Energy.

 

These are to be tweaked at a later date so they align correctly.

Now that the bars are visible on screen I need to link them to their respective properties and create a system to keep track of how much health and stamina is remaining represented to the image scale.

 

This requires linking the image to the health script that was already in place.

The last part that was required for this was to find a away to have the health value scale down the the image value as the health value is 100 and the image value has a max of 1.

This required a simple line of code which tells the system that the health bar is equal to max health amount and then divided by the current health amount.

 

I then recreated this script process for the energy although I added a drain overtime for the energy as well as a reduction for each ability used/bullet fired.