Setting up my UI & adding player’s Score

Objective: Setup my UI canvas and score text for Space Shooter game.

Creating UI feature in Unity is fairly easy. For the player score I’m going to make it text based. In the Hierarchy View right click, go through the list, select UI then select Text.

When I do this, it creates a few things.

Firstly, the canvas. The Canvas is where all our UI features are going to go. You can see the outline of the canvas that’s represented by the white line edging cutting in the Scene View.

You can also see it created an Event System. The Event System, allows us to hover over things like buttons and sliders.

And lastly is the Text, which is where I want my game score to go. And you can see that it creates a text box on the Scene as highlighted below.

I rename my Text box to Score_text. Also in the Inspector View I can change my color using the color picker. I’m changing it to white just so it stands out more against the background. While I’m doing my adjustments I set my font size to 20, just to make it a little larger.

Next, I position my score text to the top right of the screen. I do this with anchoring so if I resize the screen, say to shrink it down and port to mobile, the score text still stays at the top right or wherever I position it.

At the top of the Inspector View is the anchor image, by clicking on that I can select the top right preset and then fiddle with the Pos X & Pos Y to get it where I want it.

I also need to make sure my Canvas scales with the screen size, so if I change the size of the screen I want to make sure the canvas sticks with the size of the screen, and not the original pixel size it was created at. To do this, I firstly select my canvas from the Hierarchy View, then in the Inspector View in the canvas scaler selection, I use that top drop down and change it to Scale with Screen Size. That will make sure no matter the screen size of the game output the canvas will stay in proportion.

Lastly, before I work on implementing the score system (which will be explained in another post), I want to change that text to say score. I select the Score_text and in the Inspector View under the Text area, I simply replace “New Text” with what I want it to say.