Adding Thruster Bar to the HUD Part 1

In this article, I will go over adding a Thruster Bar that keeps track of how long the player is using the Thruster Boost (holding down Left Shift key). When the Thrust is not being used there will be a delay until the bar starts to regenerate. While the bar regenerating, the Thruster can be used but the regeneration process will start over.

We are going to Unity’s UI Slider component, so we will add it to the already existing Canvas and rename the Slider to ThrusterBar.

The Slider component has some children objects and one of those is the handle slide. Since this is for UI, this part is used for the user to interact with and manipulate the slider. But, we are not using it as a UI component so we will delete the Handle Slide Area.

We need to make sure we zero out the Left and Right of the Fill Area and Fill, so the whole bar will be used.

Let’s create a script for the Thruster Bar. The first variables we will initialize is a Public Slider to hold our ThrusterBar and two int variables that will be the max value for the the ThrusterBar(100) and the current value of the ThrusterBar.

In the inspector, we will assign the ThrusterBar (formally known as the Slider) to our script.

In the On Start, lets set the values for the ThrusterBar. The current value is set to max value (100), the maxValue for the slider is set to the max value, and the slider current value is set to the max value. You will notice to access different aspects of the Slider component you will use the Slider handle (thrusterBar) follow by . and choose what you want to return.

Next, we will create a public method so we can use it in the Player script and add an int parameter that will be the amount of the ThrusterBar will deplete when used. IF the current value of the thruster bar minus the amount used is greater than/equal to 0, we will subtract the int amount from the current thruster value and set the slider value to the current value of the thruster. When the current thruster amount hits 0, we will log “No Thrusters” for now.

Let’s head to the Player script so we can call the ThrusterBar when the Player uses the Thruster. We are going to get a handle on the ThrusterBar and assign it in the Inspector.

Now we can call the UseThruster method from the ThrusterBar script via the handle and pass in the amount we want to deduct from the ThrusterBar.

This is what the ThrusterBar looks like at the current stage. When we hold down the Left Shift key the bar decrease, but now we want it to regenerate after time.

Back to the ThrusterBat script. We want to wait some time before the ThrusterBar starts to regenerate, so we will need to use a Coroutine with an IEnumerator.

First, we will yield return a new WaitForSeconds and pass in the amount of time (in seconds) we want to wait before the ThrusterBar starts to regenerate. Using a While Loop, the loop will run until the current value of the Thruster is less than the max value of the Thruster. When the current Thruster value is greater than the max Thruster value (100), the code will exit of the loop. To increase the ThrusterBar, we will add the value of the max thruster value (100) / 100 to the current thruster value. Dividing by 100 adds some flexibility the code because if you want to increase the max value, the regeneration value will be the same, no matter the max value.

Once we are updating the current thruster value, we will set the slider value (ThrusterBar) to the thruster value. Lastly, we will want to wait a brief moment before running the loop again to give the program a breather. Typically, I would use a yield return a new WaitForSeconds, but since we are using a loop that mean we are creating many new WaitForSeconds. In optimizing this…

we can create a WaitForSeconds variable that will hold the new WaitForSeconds and use that in the loop instead.

At this stage, the regeneration is working but there is an issue when you get to a certain point, before the bar is empty, it starts to regenerate. Also, when we use the thrusters while it is regenerating, there is a back-and-forth between the bar depleting and regenerating. This is not the desired behavior. First, the bar should be able to become empty and when the bar is regenerating, if you use the thrusters the Coroutine needs to start over.

In the ThrusterBar script, we will store the Coroutine in a variable called _regen.

In the UseThruster method, where we used the RegenThruster coroutine before, we will want to perform a check to see if the RegenThruster coroutine is in process when the UseThruster method is called and if it is we will stop the RegenThruster coroutine then call it again.

Finally, the last thing to add is in the RegenThruster coroutine is make the _regen to null after the While Loop is done. This is important because it lets us know if the Regeneration process is complete and if it is not and the UseThrusters is called, the regeneration process will start all over.

In Part 2, we will add the functionality off when the ThrusterBar is below a certain value, the thrusters cannot be used. Until next time…