Show and hide letters dynamically

You can use Typewriters to show and hide letters dynamically, choosing different pauses for any kind of characters (punctuation, letters, […]), trigger events and more.

A typewriter uses its linked Text Animator Time Scale to progress time, you can read more here: Time Scale


Showing Text

You can use "Typewriters By Character" which shows one letter after the other.

Implementing Typerwriters

You just need to add a Node with the Typewriter By Character script attached to it as a child of the RichTextLabel controlled by a TextAnimator. Then link the target TextAnimator to the Typewriter.


After adding your typewriter, you can start it as shown below:

Replacing “tmproText.text = textValue;” with typewriter.ShowText(textValue); in your code.


Controlling Letters

Start and Stop Typing

Inside the component’s Inspector you’ll find some options to control how the typewriter start should be triggered:

  • Start Typewriter Mode: tells the typewriter when to start showing letters.

Value
Explanation

From Script Only

The typerwiter can only be started by invoking Typewriter.StartShowingText()​

OnEnable

The typewriter starts every time the RichTextLabel is set active

OnShowText

The typewriter starts as soon as a new text is set (as explained in the “Showing Text” section)

Automatically From All Events

All of the above


You can create your own typewriter (read here how to create a custom typewriter via C#) or you can use the built-in one.

Callbacks (Godot Signals)

You can connect Godot Signals that will be triggered based on the typewriter activity (example: when it just ended showing text).

Signal
Explanation

OnTextShowed

Signal called after the entire text has been shown (if you’ve set “Use Typewriter” to true, it will wait until all letters are shown)

The following below only work if the “use typewriter” is set to true:

Signal
Explanation

OnTypewriterStart

Called right before the typewriter starts showing its first letter. It doesn’t work if the typewriter is off, since it would coincide with the “OnTextShowed” event (in this case you can use that one instead)

OnCharacterVisible(Char)

Called each time a character became visible

You can hover the mouse above the typewriter options (e.g. delays) to show some tooltips and extra information!