How to Create a Heads-Up Display in GameMaker: Studio - dummies

How to Create a Heads-Up Display in GameMaker: Studio

By Michael Rohde

GameMaker: Studio allows you to draw GUI elements directly over the application surface of your game. These types of GUI elements typically include such things as the score, number of lives, virtual keys, and so on.

To do this, you need to continue from the preceding procedure. Basically, you’ll be using the interface values to place different items (score, lives, keys) around the GUI layer to create a heads-up display.

A HUD is great for games in which the player needs to know certain information, such as how much health she has left, how much ammo she has, where she is on a map, how strong her shields are, and so on.

To get started, you have to create a new Sprite of your choosing. Name this Sprite spr_Button. For the purposes of the tutorial, a green circle for the Sprite was created as indicated in the in-software tutorial.

The following procedure shows how to draw this Sprite in each corner of the application surface. In this way, you can create your own HUD. This same procedure could also work for drawing text or backgrounds.

The following procedure uses The_Application_Surface_Scaling tutorial.

  1. Double-click obj_Control from the Resource tree.

    The Object Properties appear.

  2. Select the Draw GUI Event from the Events section.

    The Actions for the Draw GUI Event appear in the Actions section.

  3. Double-click the Execute Code Action from the Actions section.

    The code window appears.

  4. Add the following code after the existing code:

    draw_sprite(spr_Button, 0, x1 + 32, y1 + 32);
    draw_sprite(spr_Button, 0, x2 - 32, y1 + 32);
    draw_sprite(spr_Button, 0, x1 + 32, y2 - 32);
    draw_sprite(spr_Button, 0, x2 - 32, y2 - 32);
  5. Click the green check mark to save and close the code window.

If you run the game now, you should see something similar to this figure.

The Sprite appears in the four corners.
The Sprite appears in the four corners.