Learn to code by making a 2.5 D space shooter game.
Objective: Implement live display.
To do this let's jump to Hierarchy, then canvas right-click go-to UI<Image then snap the Image to the top left corner.
The first select image then drags three lives sprite to the source image, since we want our player to start with 3 lives. Normally sprite will have a stretch issue to solve it check the box preserve aspect ratio.
To make things clear let us rename our image to Lives_Display.
In order to update Display_image which is image component we need to know what is needed to change is sprite inside the Image component called source image which is a sprite.
Now we need a reference variable for an Image component, this is the UI element responsible to display sprite on the screen.
If we look into our Image component there is a source image responsible to swap the sprite.
This shows we need a sprite variable to swap sprite according to how many lives we have, but since we have four sprites we need an array variable to store a reference of 4 sprites when we swap between sprite corresponding to lives we have.
Now drag the component to the field inside UIManager on canvas
To update live display we need to create a method with parameter in order when we call this function on damage method in a player we can pass current lives int to update Lives sprite correspond to how many player have.
Last we need to call this method when we take damage inside a player, make sure you communicate with UIManager properly.
If you don't know how to communicate with components using a script, the article for script communication is here:https://suleimanabdullah.medium.com/learn-to-code-by-making-2-5-d-space-shooter-cb1c4c67213b
This is how we implement lives display, see you in the next article.
