TutoProjectHUD class: Drawing on the screen

In this article, we will see how to draw text on the screen using a class of type HUD. In case you didn’t know, HUD is short for Heads-Up Display.

The information we want to draw on the screen is as follows:

There is an event in the AHUD class called DrawHUD() that is executed at each frame. It is in this event that we put the functions that draw on the screen. We need to override the DrawHUD() event in the ATutoProjectHUD class.

Open the TutoProjectHUD.h file and add the declaration of the DrawHUD() function below the BeginPlay() function:

...

protected:

	class ATutoProjectGameMode* TutoProjectGameMode;

	virtual void BeginPlay() override;
    
	virtual void DrawHUD() override;
		
};

To define the position where the elements will be drawn in the HUD, we use screen coordinates that are called ScreenX and ScreenY. These coordinates represent a pixel on the screen and the origin is in the upper left position. The next image shows how the ScreenX and ScreenY values change.

The AHUD class has a variable called Canvas that is a pointer to the UCanvas class. If you need to know the screen size available for drawing, access the SizeX and SizeY variables like this:

Canvas->SizeX;
Canvas->SizeY;

Now let’s see how to prepare the text that will be drawn on the screen. The line of code below creates a variable called TextHUD that will store the Score: text plus the current value of the Score variable that is obtained from the TutoProjectGameMode class.

FString TextHUD = FString::Printf(TEXT("Score: %d"), TutoProjectGameMode->GetScore());

Let’s look at the parts of this assignment:

  • FString TextHUD : Definition of the TextHUD variable. FString is an Unreal Engine class used to store text.
  • FString::Printf() : Printf() is a function of the FString class that returns an instance of FString created from a template text with variable values that are inserted into the template text.
  • TEXT(“Score: %d”) : This is the first parameter of the Printf() function. The characters %d will be replaced by the value of the variable that is in the second parameter of Printf(). TEXT() is a macro used to ensure compatibility between ANSI and UNICODE standards.
  • TutoProjectGameMode->GetScore() : This is the second parameter of the Printf() function. The GetScore() function returns the value of the Score variable of the TutoProjectGameMode class. This value will be inserted where the %d characters are.

 

The AHUD class has a function called DrawText() that we will use to draw the game information on the screen. In the line of code below, the DrawText() function is drawing the contents of the TextHUD variable using yellow, in the screen coordinate (10, 10).

DrawText(TextHUD, FColor::Yellow, 10, 10, nullptr, 3.0f, false);

The word nullptr is a null pointer that is being passed in the Font parameter. When the Font is null, the DrawText() function uses the default Font. The parameter with the value 3.0f is of type float (decimal) and represents a scale that changes the Font size. The last parameter with the value false is to indicate whether the scale should modify the position.

The parameters of the DrawText() function are equivalent to the parameters available in the Blueprint node Draw Text:

Open the file TutoProjectHUD.cpp and add the definition of the function DrawHUD() with the statements to draw the values of Score, Time, and PlayerLevel.

void ATutoProjectHUD::DrawHUD()
{
  Super::DrawHUD();  

  FString TextHUD = FString::Printf(TEXT("Score: %d"), TutoProjectGameMode->GetScore());
  DrawText(TextHUD, FColor::Yellow, 10, 10, nullptr, 3.0f, false);

  TextHUD = FString::Printf(TEXT("Time: %d"), TutoProjectGameMode->GetTime());
  DrawText(TextHUD, FColor::Red, 300, 10, nullptr, 3.0f, false);

  TextHUD = FString::Printf(TEXT("Player Level: %d"), TutoProjectGameMode->GetPlayerLevel());
  DrawText(TextHUD, FColor::Blue, 550, 10, nullptr, 3.0f, false);
}

Note that the same TextHUD variable is being used in the three executions of DrawText() and that its definition with the type FString was only done in the first line of use of the variable.

Leave a Reply

Your email address will not be published.

Fill out this field
Fill out this field
Please enter a valid email address.
You need to agree with the terms to proceed

Menu