Creating the HUD

Most games have some visual representation of how you're doing in the game. This is usually represented via a HUD (Head Up Display). It's basically an overlay of important game information such as score, lives, weapons you have, etc.

My game is starting to shape up and is actually playable now, however I don't know how well or badly I'm doing because all of my game variables aren't presented to me.

So I need a HUD!

My HUD just needs to display my current score, my lives left, the remaining peeps I need to abduct and most importantly... how much fuel I have left before I crash.

HUD information is displayed in many different ways, from simple text, to icons to bars and other fancy graphics.

For my HUD I'm going to keep it fairly simple. Score is going to be text, Lives and Peeps Left are going to be text next to a friendly icon explaining the text and the Fuel is going to be a bar representing a fuel gauge showing how much fuel I'm burning through.

The text and icons are fairly straight forward, I've just used the SpriteBatch function to draw fonts on screen and other Texture2D items for my icons.

The fuel gauge again isn't overly difficult, all I've done is built a simple function that draws a single pixel in a given colour a certain width and height across the screen. Then I repeat this drawing to give the impression of a full potential fuel level (red bar) and the actual fuel level (green bar).

Then in my HUD class when my update code is executed, I just update the relevant variables from the game code and the HUD displays them accordingly.

Very easy to implement but makes the game a whole heap more playable.

One other thing I can see now is when I complete a level, my score and lives reset. This is because previously I was setting lives and score in the level and not keeping track of them in a global state. Simple fix and now when I progress levels my lives and score stay as they should do.