Creating a Thruster Gauge Feature for our 2D Galaxy Shooter Game in Unity-Part 02!
Objective: Part 02 looks at the coding side of building our Thruster Gauge feature.
In the previous article, we setup our UI Slider bar in Unity that is going to be used as our Thruster Gauge feature. Now we can run through the coding side of this system, so let’s get into it!
We can continue to work in the ‘ThrusterController’ script so open this up and let’s run through all the newly added code:
First let’s create our handles to the Slider component and the Image component of the Fill and Background fill game objects as we are going to be making some changes to these via code.
And secondly, let’s store (cache) our colour variables for our blue, red and white thruster gauge as these are going to changed quite frequently and we want to keep an eye on performance (namely calling ‘new’ all the time).
Next, as usual we need to grab our components and do our null reference checks:
We are also going to be setting our _fillImage.color to our normal color which is going to be the blue at the start of the game.
Now for the most crucial part of setting this slider bar up. Within our Update() method, we need to set the Thruster Bars Slider ‘VALUE’ to be equal to our ‘_thrusterPercent’ so it is tracked and updated every frame.
Now that we have these setup, we need to add some code to our existing couroutine — ThrusterOverloadRoutine() which is going to incorporate a nested coroutine that handles the thruster gauge overload red and white flicker.
Here we are setting the background image and the fill image of our thruster gauge to both start as red and then 0.25 seconds later, they are both going to swap to white and change again in 0.25 seconds. This will continue as it is stuck in a while loop until the _coroutinePlaying switches to false, which is after 3 seconds in the first coroutine.
Then, the background image and the fill image are both going to go back to their respective white and blue colours once the overload sequence has finished and the thruster gauge is recharging.
Next Up: Part 03-Let’s finish this feature by adding in some audio cues!