Building a Score System using UI Elements in Unity

The next step to completing this game is to add in some UI. We want to be able to know how many points we have earned, how many lives we have left, what skills are active, and maybe even how long they have left. This can all be accomplished using the UI system in Unity.

Let’s start off with what most games have these days, a scoring system. This can give the player a sense of accomplishment seeing how well they are doing and even push them to try for a higher score next time, or even to beat their friends’ high score!

First, Let’s add in the functionality for the points. Adding a Variable of type int on the Player, and a public method to get called from other scripts to update the score

By adding in the “int addPoints” at the end, This gives the enemy the choice of how many points we get.

When we shoot the enemy is when we want to give the player the points so next, into the enemy script. Since the Player is confined to when it gets hit by the Player, we will need a new reference to the player.

Seems all those other articles are coming in handy! This can be found in the Script communication.

This will give us access to calling the AddScore method we had just made, remember to null check.

Later we can add in a variable instead of hard coding in 10 points, this way we can have different enemies give different points!

And done! well… getting points that is. Next, we will make the points show up on the screen when we kill something. For that, we will want to make a new script to handle all the UI updates and the actual UI to update, let’s start with that first.

In the Hierarchy create a UI element of Text, this will make a Canvas where all our UI will be shown and an EventSystem which is for if we want to make buttons later on.

If you can’t see the full Canvas, you can press “F” to fill the screen with that object.

As shown above,
-Making the text, give it some text to make it easier to place.
-Changing the color, so we can see the text or fit the theme.
-Changing the wrap, so if it goes over the end it doesn’t just cut it off.
-Anchoring it, keeps it in the same place for each screen.
-Constant Pixel size, scales along with the screen.

Next, we will want to update that Score text through code. If you haven’t already, make a script for the UI management and place it on the Canvas. We want to be able to change the text, which we will need a reference to that text. but it’s not letting us? Since we are working with the UI we need to add “using UnityEngine.UI;” above the class. This will let us use the UI parts of Unity. Now, all we need to do is set the score’s text to the updated score.

Lastly, is to call this method from the player when we update our score, which means a reference for the UI Manager and remember to null check.

Drag the UIManager into the field in the inspector or use GetCompont to finish this off.

And done! for real this time. Test to make things are working perfectly and that makes another step towards a finished game.

Looks to be working perfectly for me!