Important Notice:

As of September 15, 2016, we no longer publish new courses on this website. We encourage you to use your Digital-Tutors credentials to sign in on Pluralsight where you'll find all new creative courses, skill tests and paths, 1:1 mentoring and more.
Scripting the HUD
See Details
Joshua Kinney


Joshua Kinney
In this tutorial, we're going to learn how to create a HUD to display feedback to the player. So up to this point, we've got a little bit into scripting, we've created a player spawn-- a random player spawn, as a matter of fact-- and now what we want to do is we want to get into how we can give the player feedback. And the best way to do so is through a HUD. So HUD stands for heads up display, and this is usually the elements that you would find in a game that display things like ammo, your health, the timer, and things like that. So to get started with creating a HUD, I like to go up to Game Object and create an empty game object that is going to hold all of my HUD information, including my scripts. So let's go ahead and rename this object as HUD and then let's position it as zero, zero, and zero. Now with this HUD, what I want to do is I want to bring in some textures that are going to be used to display the amount of fuel that I have in my lantern. So to do this, let's go into our imported assets and inside of our textures. I've already gone ahead and imported these textures that we're going to be using. Now, you can find these under your project files folder and they're going to be under reference files, textures, HUD. You can simply select all of these inside of your Windows browser and drag those into your textures folder, and they will come in. Now, before we can move on we need to make sure that we tell Unity what type of textures these are. So you can select all of those at the same time and switch these from texture to GUI. Doing so will tell Unity that these are going to be used for something like a heads up display. So make sure that you switch that over and hit apply. Now that we have done that, what we want to do is we want to go into our HUD and we want to add the GUI texture component. So we're going to add that component-- go to rendering, GUI texture. What this is going to do is it's going to bring up a texture that we specify and place it in front of the player's camera and it's always going to be on the camera. So the first thing that you'll see here is the texture that you want to use. Let's go ahead and hit our picker here and it will bring up our select texture dialog box, and we want to choose the lantern empty. Double click on that, and that will input that into that variable spot. You can change the color of that HUD, if you like. First off, let's just see what it looks like in our scene. So let's go to our game tab, and you can see it right here on the left hand corner. Now, it's pretty large and it's in the wrong position. I want it to be up here in the top right hand corner here. So to get started with this, let's change the positioning of our HUD game object. So with it selected, in my x direction I'm going to type in 0.925. Notice how that brings that all the way over here to the right. Let's move it up in the y direction and let's type in negative-- I'm sorry, 0.85. There we go. So here, you can see that it's in the right position. However, its scale is off. Here I can go ahead and input some scale. I could type in zero and zero, but notice how it disappears. Let's not do that. Let's type in one and one. Now, the object is still there, but whenever we type in these scale values at zero, zero, we tend to have a few problems. Let's use this pixel inset instead. So the pixel inset, what this is going to do is position it according to our screen. So let's give it an overall width. So I'm going to set this to 64-- or I'm sorry, 128 by 128. And then we have our x and y position here. Now, that's just made our texture larger. Why has it done that? Well, let's set these to zero and zero on all of these, and we should be able to see that texture showing up here. Now, let's change our pixel inset from zero to negative 64 by negative 64. And there, you can see that that has opened up there. Now, these values can be a little tricky sometimes. So what I've done here is my width and height are set to half of what the image size should be. So whenever this image is brought in, it should be the size of 256 by 256. And then the pixel inset is going to allow us to fine tune the positioning of this object based on the positioning of our HUD game object. So we get a general positioning through the transform of the HUD game object, and then we come in and fine tune it through the pixel inset options here. So now we have that set, if we hit play, notice how our HUD stays in position whenever we play-- so just like a normal HUD in a game. So we have that place, we have that positioned. Now what we need to do is create a script that is going to provide feedback and switch out whenever we pick up an item. So let's get started with creating the feedback and switching out those textures. So let's create a new script. Let's go into our scripts folder and I'm going to create C# script and I'm just going to call this inventory, because I want to keep this kind of generic. So it could be weapons, it could be ammo, it could be lantern fuel in this case-- whatever you like. Let's double click on that and bring that up inside of MonoDevelop. And in MonoDevelop, I'm just going to do a little bit of clean up here sitting my brackets the way that I like them, and let's get started. So the first thing that we need to do is create our variables that we're going to be using. So what do I want this script to do, exactly? Well, what I want it to do is I want it to update the texture, so I want to pick a texture and I want to increase by one every time I pick up a lantern fuel pick up item. So first thing that I need to do is I need to set up the initial fuel amount. So whenever we start out, our lantern should be empty. So I'm going to type in public variable, and I'm only doing this because I want to be able to access this inside of the game through the inspector for testing purposes. So public, static, int, giving it type, and then fuel amount. This is a variable, and we're going to set it to zero to start out in our game. Now, one thing that you'll notice here is I've used a new word here, a new bit of information, and it's called static. So what is static and what does it do? Static simply means global. So I'm creating a variable that is going to be public so that way the end user has access to it in the inspector, but then I want this variable to be accessed by any script, and this is just kind of a just in case sort of thing. Now again, if you want to learn more about scripting and some of the vocabulary that we use and want to learn more about that, just take a look at the introduction to scripting in Unity as well as the introduction to C# in Unity. Those will be really helpful if this is something that interests you. All right. So now we've created that variable. The next thing that I want to do is I want to go ahead and start in with getting my textures that I need for the HUD. So let's create another variable-- let's call this public, and we're going to say texture 2D. This is the type of object that this is, and this is going to be an array. We're going to have a list of textures that are going to be used by this variable. So let's do open close brackets and then give it the variable name. So in this case, it's going to be hudFuelAmount. Let's just set that with a semicolon, and then I need one more. Public, GUI, texture, and we're going to set this to FuelAmountHUDGUI. This is just for the HUD game object that we created. So now at the start, whenever the game starts, we want it to set our fuel amount to zero. We want to make sure that that is always set whenever the game starts or the level starts. So we're going to say fuel amount-- and we could just use this-- fuel amount equals zero. We don't need anything in our update function because whenever we have items that are being picked up and we're updating a HUD, it only needs to be called as we pick up items. So we're going to say void-- we're going to create a new function here-- fuel pickup. So this function is going to handle updating our HUD. So the first thing that I need to do is whenever I pick up fuel, it's going to increase my fuel amount. So I'm going to say FuelAmount++. And then I need to update my HUD texture. So I'm going to say FuelAmountHUDGUI.texture equals HUDFuelAmount, and then we're going to input the fuel amount variable. So FuelAmount-- there we go. So every time that we pick up fuel, this function is going to be called. It's going to increase this number for our fuel amount, and then it's going to update that to our HUD. So now that we have done this, we want to go ahead and hit Save. Let's go into Unity and let's apply this inventory to our player object. So I'm going to go ahead and just drop this onto our first person controller. Let's select our first person controller, and I'm just going to minimize these components that I don't necessarily need right now, and here we have our inventory script. Notice a couple of things. We have our HUD fuel amount, which right now, that is set to zero. And then we have our fuel amount HUD GUI and whatever textures that is going to be using. So now at this point, what we need to do is we need to input the textures that are going to be used for this inventory. So on our size, let's go ahead and set this up. So inside of our textures-- let's take a look here-- we have, I believe, nine different textures, so one, two, three, four, seven, and nine so we're going to type in nine. And whenever we do this, it's going to update our array. So under element zero, let's go ahead and pump in the empty, and then we're going to do lantern 01, lantern 02. And I can actually drag and drop from here as well, so 03, 04, 05, 6, 7, and then full. So there we have that. Now, what is this FuelAmountHUDGUI? It's looking for a GUI texture. Let's go ahead and click on that and it should give us our HUD, because it is the game object type GUI texture. Now, everything is filled in there. And if we hit Play, we have no errors and we're ready to go. So now at this point, what we need to do is we need to create some objects that we can pick up and we'll go ahead and send that feedback to our HUD. So we're going to learn how to do that next.
In this series of Unity tutorials we are going to learn about the core features in Unity.

We will start out by learning the Unity Interface where we'll talk about the different panels and tools available in the Unity editor. From there we'll learn how to properly export and import assets into Unity. With those assets imported, we'll discuss how to create prefabs that will help us speed up the construction process of our level.

Then we'll learn how to create and apply materials to our level prefabs. Then we'll take our textured prefabs and build a simple game environment. Once the base level has been built, we will talk about adding props and set dressing our level. From there we'll continue full speed by learning how to add lights, particles, and physics objects.

Once we're happy with our level, we'll jump into scripting in Unity. We'll learn how to create a random player spawn, a HUD, item pickups, and so much more. Finally, we'll end the course with how to publish our game to the platform of our choosing.

For an additional learning resource, download your free copy of our Key Game Development Terms Reference Guide and PDF so you can get comfortable with important game dev terminology.