Let’s Make a 4X Space Game with Unity – Part 31 Resource UI

Hi guys and welcome to part 31. In the last part we sorted out how to get resources from our planets. In this part we will set up a basic UI for our resources so we no longer need to use the console to keep track of them.

First I have made 3 very simple sprites to represent our resources. If you would like to use them feel free. You can download the file here:

Resource Icons(Google Drive)

We will start by importing our sprites to the assets folder (Assets > Sprites) and set up our sprite settings.

Create a new Panel as a child of our Canvas and call it Resource Panel. Shrink it down to a small rectangle. Add 3 image objects as children of the panel and name them “Food Sprite”,  “Mineral Sprite” and “Credit Sprite”. Assign the Image object their corresponding image files.

Next add 3 Text objects as children of the Resource Panel. These will be used to show the player how many of each resource they have. Default the text to display 0 and name the text objects after each resource. I suggest making the text bold and centering it both horizontally and vertically but it is completely up to you.

Now we have all our UI elements, so let’s place them somewhere good on the screen. I will be putting them in the top left hand corner of the screen.

Feel free to experiment an place your UI in any way you would like.

We need some sort of controller to update the UI and let the player know how many resources they have. Create a new script called UIResourceManager and attach it to the Resource Panel. We will not need the update method so you can remove it. Add an awake method and a public static UIResourceManager called instance. You know the deal by now, we set instance equal to this in the Awake method.

At the top of the script add “using UnityEngine.UI” as we will need access to the unity UI library.

Next add 3 public text objects (or more if you have more resources), called creditText, mineralText and foodText.

Create a new public void method called UpdateText and pass it a Text object and and int (call them text and amount). In this method we will set the text of the passed text object to the amount that was passed along side it (don’t forget to use the ToString method on amount).

Great so we just need to call this method in the correct place. That place is in our TurnManager script so we need to open that up next.

Add a new method called UpdateResourceText. Call the UIResourceManager UpdateText method 3 times to update each of our resource texts with our player resources.

So where do we call our UpdateResourceText method? Well we could call it at the end of apply resources but we might want to have some more methods manipulate resources while the turn ticks over due to some modifiers or something, so lets just call it in the end turn method instead.

We just need to do a few more things before we finish this tutorial. The first is updating the UI at the start of the game. We can do this in our Playermanager script in the start method after we create our resources. Why do it here instead of the TurnManager? Well because it is slightly safer to put it here. If we call the UpdateText method in the TurnManager script and the PlayerManager script has not initialised then we may get an error. So doing this just after the resources are created will make sure they exist before we call them. We can call the UpdateResourcesText function in the TurnManager script to save re-writing the same code again (make the UpdateResourcesText method public)

Next we need to update the resources when we build a ship so we can also call the UpdateResourcesText as the last function on our Build Ship Button OnClick method.

Finally we need to assign the correct object to the text objects on out Resource Panel inspector

Hit pay and test out the new resource UI 🙂.

This concludes this tutorial. While making it, I noticed we don’t refund the resources for a cancelled ship in our ship cue. So in the next part we will fix that and start looking at how we will select our ships.

Scripts (PasteBin)

Part 32 Resource Refunds – Coming Soon