Using HUD objects

Knowledgebase / Using HUD objects

 

Screen Shot 2016-04-14 at 10.10.17 am

Most games have a HUD (head-up display) which usually displays how much health, lives, and points the player has. There are a few different HUD objects available in the Gamefroot Classic Pack:

  • Red and green NPC health bars
  • The player’s health bar
  • 0 (a number that can display score and lives)
  • x (you can put this in front of the lives number)
  • HP (you can put this next to the player’s health bar)

Note: To use these HUD objects properly, first create a new layer above all your other layers. When you place HUD objects into your level, make sure you have that top layer selected so that the HUD objects will never be hidden behind anything.

 

Screen Shot 2016-04-14 at 10.26.53 am

The red and green NPC health bars have a Health Bar script attached to them which makes it so all NPC’s have their amount of health displayed above their heads when they are damaged. Learn more about NPCS (non-player characters).

To use the NPC health bars, select your top layer and then place either the red or the green NPC health bar anywhere in your level. The bar will make copies of itself, and only appear above NPCs that are damaged.

ezgif.com-video-to-gif (2)

 

To change its properties, right-click on it and select Instance Properties.
Screen Shot 2016-04-14 at 10.37.37 am
These are the properties you can change on the NPC’s health bar:
  • Display Length: this is the number of milliseconds that the health bar will be visible for when the NPC takes damage. It is 2000 by default, so when the NPC takes damage you will see the health bar above their head for 2 seconds (1000 milliseconds = 1 second)

 

Screen Shot 2016-04-14 at 10.15.27 am

The player’s health bar has a HealthBarHUD script attached to it which makes the bar display the player’s health and follow the camera.

To use the player’s health bar, select your top layer and then place the health bar in the top-left corner of your level.

ezgif.com-video-to-gif (1)

 

To change its properties, right-click on it and select Instance Properties.
Screen Shot 2016-04-14 at 10.20.48 am
These are the properties you can change on the player’s health bar:
  • Instance Tag: the health bar will display the health of the character that has this tag (default is player).
  • Snap To Camera: set this to false to stop the health bar from following the camera.

 

Screen Shot 2016-04-14 at 11.02.48 am

The number 0 can be used to display the score or the amount of lives the player has left.

To use this number object, place it near the top-left corner of your level. It doesn’t have a script attached to it, so you’ll need to select either the LivesHUD script or ScoreHUD script from the scripts sidebar, and click on the number object to attach the script.

ezgif.com-video-to-gif (4)

Note: the number for score needs to have a gap between it and the edge of the level so that the extra numbers can be displayed.

These scripts will display either the player’s lives left (based on how many times the player has died), or the players score (based on how many collectibles the player has collected). These scripts will also make the number follow the camera.

The number with the ScoreHUD script attached has properties you can change. To change its properties, right-click on it and select Instance Properties.
Screen Shot 2016-04-14 at 11.54.41 am
These are the properties you can change on the number object with the ScoreHUD script:
  • Number of Additional numbers: this is the number of numbers you’ll see. e.g. 4 numbers will appear as 0200 if the player has 200 points, and 5 numbers will appear as 00200.
  • Snap to camera: set this to false to stop the numbers from following the camera.

 

The number with LivesHUD script attached has no instance properties to edit.

 

Screen Shot 2016-04-14 at 11.58.37 am

The lettercan be placed in front of the number for lives. Make sure to attach the LivesHUD script to this object to make it follow the camera.

 

Screen Shot 2016-04-14 at 11.58.41 am

The letters HP can be placed next to the player’s health bar. Make sure to attach the HealthBarHUD script to this object to make it follow the camera.

 

By arranging your HUD objects like this…

hud complete

 

…you can get your HUD in your game to look like this:

Screen Shot 2016-04-14 at 12.07.26 pm