Creating the UI

Creating a UI for your game can be very complex, or at least time-consuming. Precisely placing individual elements and ensuring they work across different-sized screens and devices is the least interesting part of game development for many programmers. Godot provides a wide variety of Control nodes to assist in this process. Learning how to use the various Control nodes will help lessen the pain of creating a polished UI.

For this game, you don’t need a very complex UI. The game needs to provide the following information and interactions:

• Start button
• Status message (such as “Get Ready” or “Game Over”)
• Score
• Lives counter

Here is a preview of what you will make:

Figure 3.18: UI layout

Create a new scene and add a CanvasLayer node with the name HUD as the root node. You’ll build the UI on this layer using the Control node’s layout features.

Layout

Godot...