Creating a Game Over overlay
We got our Player’s lives displaying properly, but what happens when their Lives reach 0? At the moment, nothing. The Player gets destroyed and that’s it. It’s time to spruce it up a bit and really let the Player know that they are indeed, 100%, without a doubt, dead.
Creating the Text
Just like with our Score, we’ll simply be using Text as our UI element.
Create the Text element, change the Text and colour:
Then we can change the font, font size, and change our Horizontal and Vertical Overflows to overflow. This allows our text to bleed through it’s Rect Transform. Then we can position our Game Over text to the center of the screen!
The UIManager script
We’ve got the Text element ready to go, now to make it do some stuff! In our UIManager script we’ll first create a reference to our Game Over Text:
Also we’ll create a new function to activate our Game Over text:
It’s important to note that we need to access the .gameObject of our text element to access the .SetActive() function!
Then we can properly link our GameOver_text in the Inspector:
And since we don’t want our Game Over text to be active when we start the game, we’ll deactivate the GameOver_text Game Object:
Now we’ll update our UpdateLives() function to activate our GameOverScreen() when our Player’s lives = 0:
Our code in action:
Creating a Flicker Effect
While it’s great that we have a working Game Over screen, it doesn’t quite feel right, yet. I would like it to flicker and really grab the Player’s attention, like a retro arcade game.
To achieve this effect, we can use our good friend Coroutine to turn on/off the Game Over screen to look like a flicker. This will change the code of our GameOverScreen() function, but that’s okay!
This will turn the Game Over overlay on and off every 0.5 seconds :)
Great success! Our Player now knows when he has completely and utterly been destroyed! But now we’re stuck on this screen forever… That’s not good.
Next we’ll look at Scene Management and reloading the scene/game.
