Creating a Retro Game Over Display
This article will go over a lives display and a GAME OVER screen when those lives run out.
First, we will add an image element to our UI Canvas and setting the Source Image to the Lives Display Image. This Image is going to be the one that updates as the player loses a life. Once we add it, we need to position, anchor it to the top right corner and turn on the Perspective Aspect to prevent the image from stretching.
We need to add a Sprite array that will hold the different images of the the lives (3 ships, 2 ships, 1 ship, no ship).
In the Inspector, since the Sprite array was a Serialized Field, we are able to determine the size of the array which will be 4 elements. Now, we need to drag the Sprite Images for three lives into Element 3, two lives into Element 2, one live into Element 1 and no lives into Element 0.
The Lives Displays Image will need to be updated and we can do that by accessing each of the elements in the array that now holds the corresponding image.
To make the Lives Image access and update the different elements of the array, we will need to create an Image variable to store in the UI Manager script.
This variable should be a made a Serialized Field, so we can assign the Lives Display Image to it in the Inspector.
In the UI Manager script, a public method will be created with an integer parameter. We will set the Lives Image to the Lives Array and pass in the parameter.
This method needed to be public, so the UI Manager can communicate to the Player script which controls the Player’s lives. When the Player loses a life, we access the UI Manager and the Update Lives method and pass in the current value of the lives.
Our Lives Display Image, will now show the current amount of lives the Player has and when the Player is out of lives, we want to let them know by Flashing GAME OVER is big letters. This is dealing with the UI, and the GAME OVER is an UI Element of text. Once we add this element, we can change the text, enlarge the font, change the font style and color too.
The UI Manager script is going to need to control when to display this GAME OVER text, so we are going to add a variable type Text to the script and assign the Text UI Element in the Inspector.
As of now, the GAME OVER text is appearing on top of the game while we are playing and while we still have 3 lives. We need to basically turn it off until the Player is out of lives. In void START, we can do this by accessing the game object of the GAME OVER text and set its active status to false (off).
Last, we add a IF statement to our Update Lives method to check when the Player has 0 lives and when they do, we can call a Coroutine that will the GAME OVER text on and off in a loop.