Skip to content

Continue Indicator

Dia:
    "Here, we'll create a little 'Press-to-continue' indicator
    when the dialogue line has finished rendering."
:
    "This small touch helps with player's pacing, and reduces accidental skips."
:
    "The player will know if the dialogue line has finished,
      delay=3
    or if there's more to see."

TL;DR

Create a Label node, prompting the player to continue the dialogue.
On the DialogueLabel's text_rendered signal, hide said Label node.
And on the TheatreStage's progressed signal, show the Label node.

  1. Create a Label node. We'll name it ContinueIndicator.

    MyScene
      ├─ TheatreStage
      └─ PanelContainer
            └─ VBoxContainer
                ├─ Label
                ├─ DialogueLabel
                └─ ContinueIndicator
    

    And set the text as a simple "Press space/enter to continue". Since we are progressing the dialogue via the built-in 'ui_accept' input event, which is the space or enter key.


  2. Reference the Label node as continue_indicator in the script.

    @export var continue_indicator: Label
    


  3. Connect the text_rendered signal of the DialogueLabel, to the method _on_dialogue_label_text_rendered().

    func _on_dialogue_label_text_rendered():
        pass # Replace with function body.
    

    In this method, we'll call show() on our continue_indicator.

    func _on_dialogue_label_text_rendered():
        continue_indicator.show()
    


  4. Connect the progressed signal of the TheatreStage, to the method _on_theatre_stage_progressed().

    func _on_theatre_stage_progressed():
        pass # Replace with function body.
    

    Here, we'll call hide() on our continue_indicator.

    func _on_theatre_stage_progressed():
        continue_indicator.hide()
    
  5. We are actually done by this point. But, to tidy things up a little, lets add a Control node, right in-between our DialogueLabel and ContinueIndicator node. And lets name it Space.

    MyScene
      ├─ TheatreStage
      └─ PanelContainer
            └─ VBoxContainer
                ├─ Label
                ├─ DialogueLabel
                ├─ Space
                └─ ContinueIndicator
    

    Set its vertical container sizing to Fill, and tick the Expand checkbox.

    • Control node, with its vertical container sizing sets to fill & expand

    This will 'push down' the press-to-continue label, so that it 'sticks' to the bottom of the container.


Code Summary

MyScene
  ├─ TheatreStage
  └─ PanelContainer
        └─ VBoxContainer
            ├─ Label
            ├─ DialogueLabel
            ├─ Space
            └─ ContinueIndicator
extends Control

var dlg: Dialogue # Load/create Dialogue here

@export var my_stage: TheatreStage
@export var continue_indicator: Label

func _input(event):
    if event.is_action_pressed("ui_accept"):
        my_stage.progress()

func _ready():
    my_stage.start(dlg)

func _on_dialogue_label_text_rendered():
    continue_indicator.show()

func _on_theatre_stage_progressed():
    continue_indicator.hide()


Got any questions? feel free to ask them in the GitHub Discussions!