← OUTLINE

Lightning Round

Six games, sixty seconds each

The 60-second pitch

While you listen

Two of you become each team's stakeholders at the proposal gate this Thursday. The questions you write today are your first review notes.

One more listening job: for each game, guess what its HUD has to show. You will need that guess at the end of class.

← OUTLINE

Screen Space

Control nodes, anchors, and containers

Two worlds on one screen

A Control is a rectangle

• Every Control has four anchors: where each edge attaches to its parent, from 0 (left or top) to 1 (right or bottom).
• Offsets are the pixel distances from those anchors.
• Anchor presets set all of it in one click: Top Left, Center, Top Wide, Full Rect.

Containers do the layout

What we are building

RIVAL-BRAINS, BY THE END OF CLASS
root
├─ Scoreboard                 round 3: an autoload
└─ Main (Node2D)                game.gd, the brain
   ├─ Walls, Player, Rival, Fig
   └─ UI (CanvasLayer)
      ├─ Banner (Label)         from Week 5
      ├─ HUD                    round 1: hud.tscn
      └─ PauseMenu              round 2: pause_menu.tscn

• Round 1: survival time on the left, best time on the right.
• Round 2: Escape freezes the chase and opens a menu.
• Round 3: the best time survives a restart.

← OUTLINE

Round 1: The HUD

A heads-up display.

How to play

Every step is on these slides. Keep the deck open beside Godot.

Loading screen

git clone https://github.com/LucasCordova/rival-brains.git
cd rival-brains
git switch demo5          # where last week ended
git switch -c hud-coop    # your own branch for today

Already have the clone? Run git fetch --tags first, then the two switch lines.

Save points

Each finished round is saved in the repo. Jumping to one sets aside your own work and gives you a clean, running copy.

Round 1, step 1: a scene for the HUD

HUD.TSCN SO FAR
HUD (MarginContainer)

Top Wide pins the HUD to the top edge and stretches it from the left edge to the right edge.

Round 1, step 2: a row of labels

HUD.TSCN
HUD (MarginContainer)
└─ Row (HBoxContainer)
   ├─ TimeLabel (Label)
   ├─ Spacer (Control)
   └─ BestLabel (Label)

The names matter. The script finds these nodes by path, and $Row/TimeLabel has to match exactly.

Round 1, step 3: hud.gd

extends MarginContainer

@onready var time_label: Label = $Row/TimeLabel
@onready var best_label: Label = $Row/BestLabel

func show_time(seconds: float) -> void:
    time_label.text = "TIME %.1f" % seconds

func show_best(seconds: float) -> void:
    best_label.text = "BEST %.1f" % seconds

Round 1, step 4: into the game

MAIN.TSCN
Main (Node2D)
├─ Walls
├─ Player
├─ Rival
├─ Fig
└─ UI (CanvasLayer)
   ├─ Banner
   └─ HUD

Running now shows TIME 0.0 and BEST 0.0, frozen. Nobody is handing the HUD any numbers yet.

Round 1, step 5: game.gd keeps time

Open game.gd. Three small edits near the top. Lines marked # new are added; the rest already exists and shows you where.

# game.gd: two new variables, under rival_start
var time_alive: float = 0.0
var best_time: float = 0.0

# one new line, under the banner line
@onready var hud: MarginContainer = $UI/HUD

# _delta becomes delta, because now we use it
func _physics_process(delta: float) -> void:
    match state:
        State.PLAYING:
            time_alive += delta           # new
            hud.show_time(time_alive)     # new

Round 1, step 6: the door

Still in game.gd, in _change_state (the door from Week 5). Add the marked lines, then save.

# game.gd, inside _change_state
        State.TITLE:
            rival.calm()
            time_alive = 0.0              # new
            hud.show_time(time_alive)     # new
            hud.show_best(best_time)      # new

        State.CAUGHT:
            if time_alive > best_time:    # new
                best_time = time_alive    # new
                hud.show_best(best_time)  # new

In TITLE, the three lines go right after rival.calm(). In CAUGHT, they go first.

Round 1: go

Steps 1 to 6 are the six slides above this one.

Round 1: nothing happened?

← OUTLINE

Round 2: The Pause Menu

Freeze the world, keep the menu awake

Pausing is one line

get_tree().paused = true

• Every node in the tree stops processing: no _process, no _physics_process, no input callbacks [4].
• Blitz freezes. The rival freezes. The clock in game.gd freezes.
• A pause menu is in that tree too, so it freezes with everything else. Its buttons would never hear a click.

Round 2, step 1: the overlay

Round 2, step 2: a centered column

PAUSE_MENU.TSCN
PauseMenu (ColorRect)
└─ Center (CenterContainer)
   └─ Menu (VBoxContainer)
      ├─ Title (Label)
      ├─ ResumeButton
      └─ RestartButton

Two containers, zero pixel math. Add a third button later and the column re-centers itself.

Round 2, step 3: pause_menu.gd

Right-click PauseMenu, Attach Script, keep pause_menu.gd, Create. Replace the whole file, then save.

extends ColorRect

var allowed: bool = false

func _ready() -> void:
    hide()

func _unhandled_input(event: InputEvent) -> void:
    if event.is_action_pressed("ui_cancel") and (allowed or get_tree().paused):
        _set_paused(not get_tree().paused)

func _set_paused(paused: bool) -> void:
    get_tree().paused = paused
    visible = paused
    if paused:
        $Center/Menu/ResumeButton.grab_focus()

• ui_cancel is Godot's built-in action for Escape. Menus use ui_ actions.
• allowed is set by the game: pausing only makes sense mid-chase.
• grab_focus() lets the keyboard press the button.

Round 2, step 4: wire the buttons

func _on_resume_button_pressed() -> void:
    _set_paused(false)

func _on_restart_button_pressed() -> void:
    get_tree().paused = false
    get_tree().reload_current_scene()

Round 2, step 5: into the game

# game.gd: one new line, under the hud line
@onready var pause_menu: ColorRect = $UI/PauseMenu

# game.gd, inside _change_state, under the two set_physics_process lines
    pause_menu.allowed = running

Predict: the Restart button

Keep your vote. You are about to find out on your own machine.

Round 2: go

Steps 1 to 5 are the slides above this one.

Round 2: nothing happened?

← OUTLINE

One Careful Global

Autoloads, and the discipline to keep them small

Where did BEST go?

THE RUNNING TREE
root
└─ Main                 freed and rebuilt on Restart
   ├─ game.gd           var best_time lived here
   ├─ Player, Rival, Fig
   └─ UI
      ├─ HUD
      └─ PauseMenu

• A variable lives exactly as long as the node that owns it.
• reload_current_scene() replaces every node in the scene. Each variable starts over.
• The same thing happens when you change scenes: title screen to maze, maze to maze.

Autoloads

WITH AN AUTOLOAD
root
├─ Scoreboard           stays for the whole session
└─ Main                 freed and rebuilt on Restart

Scoreboard.report(time_alive)

Any script, anywhere, with no node path.

The temptation

Reachable from everywhere is exactly what made last Thursday's Berry Bandit fragile. Lines 28 and 29:

        Game.score += 50
        get_node("/root/Main/HUD/ScoreLabel").text = "Score: " + str(Game.score)

• Any script can change Game.score, so when it is wrong, every script is a suspect.
• Once one global exists, everything drifts into it: health, the current maze, the player node. That is the god object again, with a shorter name.
• Nystrom's chapter on Singleton is mostly a warning label for this reason [1].

Verdict: global or local?

Thumbs up for autoload, thumbs down for keep it in the scene. Vote before each verdict appears.

Rules of globals

Round 3, step 1: scoreboard.gd

extends Node

signal best_changed(seconds: float)

var best_time: float = 0.0

func report(seconds: float) -> void:
    if seconds > best_time:
        best_time = seconds
        best_changed.emit(best_time)

Round 3, step 2: register it

Round 3, step 3: report and listen

In game.gd: delete the var best_time line and the hud.show_best(best_time) line in TITLE. In CAUGHT, replace the three best-time lines with one:

# game.gd, inside _change_state
        State.CAUGHT:
            Scoreboard.report(time_alive)

In hud.gd, add a _ready function, then save both scripts:

# hud.gd: a new function, above show_time
func _ready() -> void:
    show_best(Scoreboard.best_time)
    Scoreboard.best_changed.connect(show_best)

Round 3: go

Seeing Scoreboard is not declared? Step 2 did not stick: reopen Project Settings and check the name and the Enable box.

← OUTLINE

Game Over Screen

What you know now

Co-op: your HUD on a card

This card is a paragraph of your proposal's design detail, already drafted. Compare it with the guess you made during that team's pitch.

Checkpoint reached

Sources

• [1] Nystrom, Game Programming Patterns: Singleton (gameprogrammingpatterns.com/singleton.html), today's reading.
• [2] Godot docs: Singletons (Autoload) (docs.godotengine.org, Scripting section).
• [3] Godot docs: Canvas layers and Size and anchors (docs.godotengine.org, 2D and User interface sections).
• [4] Godot docs: Using Containers and Pausing games and process mode (docs.godotengine.org).
• [5] rival-brains, branch demo6 with tags demo6-lap1 and demo6-lap2 (github.com/LucasCordova/rival-brains).
• [6] The 20 Games Challenge (20gameschallenge.com), the anchor list for your pitches.