Tutorial ‐ Your First Dialogue
- Basic knowledge about Godot & GD Script.
- Dialogue Nodes plugin installed in your project. (Learn how to install Dialogue Nodes)
In this section we'll go through the steps of creating your dialogue data, which will later be used by the DialogueBox node to display, well, dialogues in your game. To store our dialogue data, we need to create a file. For that, go to the Dialogue tab, then click on File > New File (or New Tree), select the location where you'd like to save your file and click "OK".
The next step is to add nodes to your dialogue. Nodes are the building blocks of the dialogue. Think of them as modules in a simple computer program. By default, Dialogue Nodes provides 5 nodes, but you can add custom nodes easily as per the needs of your game project.
To add a node, click on the Add Node menu near the top, or just right click anywhere in the graph and select the node you want to add. For our case, we will add a Start Node.
A Start Node is used to define the beginning of a dialogue tree. This node contains a ID which you can set to anything. Just remember no two Start Nodes can have the same ID or else only the data of the last node with the given ID is saved properly.
The node also has a play button which can be used to quickly test the dialogue tree connected to it. For now, we will set the ID to START.
The next step is to click and drag the slot at the right edge of the Start Node and leave. The add menu will pop up, and this time, we will select the Dialogue Node. You'll notice that the new node will be automatically connected to the previous node. This is another useful method of quickly adding connected nodes.
Before we test out our dialogue, let's give the Dialogue Node some data to display. Click the textbox under the Speaker label and give it the name you want to be displayed. For our example we will set it to Greg. Then, under the Dialogue label, we will provide the dialogue text we want to the speaker to say. Once done, your dialogue graph should look like this:
Dialogue Nodes gives you the option to run a dialogue tree within the editor to get a feel of the dialogue without running your game even once. As mentioned before, this can be done by pressing the run button in the Start Node. Another method, that can be useful for when you don't want to scroll all the way to the start of a dialogue tree, is by using the Run menu. Click on Run and the start ID we set previously should show up in the menu.
The demo DialogueBox should show up and play the selected dialogue tree.
If the dialogue does not show up for you (or shows up with something missing), look into the Godot console for any errors.
Once you are satisfied with your dialogue and are ready to put it in your game, save your dialogue file by clicking File > Save in the dialogue editor (or just use the Godot shortcut Ctrl+S/Cmd+S).
Open the scene where you want to show the dialogue. For this example, we will use a simple scene with a Control node as the root and a Button node which we will use to trigger the dialogue.
Besides a dialogue editor, Dialogue Nodes also provides a fully featured DialogueBox node for displaying your dialogue files in-game. We can add it like any other node using the add button or the shortcut Ctrl+A/Cmd+A, then searching for "DialogueBox" and selecting the DialogueBox node.
Set the DialogueBox's visibility to true, and then position and resize it to your liking. The DialogueBox node inherits from a Panel node and this behaves very similar to any other Control node.
This is optional, but you can hide the DialogueBox once you're done. The node will be hidden automatically anyway when the game starts.
With the DialogueBox node selected in the Scene tab, head over to Godot's inspector, expand the Data section, and load the dialogue file we just created.
Additionally, you can also set the Start ID from the inspector. This would be the default value used when first running a dialogue. We will use another method of passing the start ID to the DialogueBox so I'll leave the Start ID entry empty.
The next step is to attach a script to a parent (if there isn't any), and in the script, store the reference to the DialogueBox. This script will be used to trigger the start of the dialogue. For our example, we will attach a new script to the scene root (Control) and click+drag the DialogueBox node into the script.
Then we'll select the Button, go to the Node tab and connect it's pressed signal to the script.
The function will be called whenever the Button is pressed in-game, so we'll use it to start our dialogue. Update the function in the code to the following:
extends Control
@onready var dialogue_box = $DialogueBox
func _on_button_pressed():
dialogue_box.start('START')Here, we're calling DialogueBox's start function to start the dialogue. Also, we're passing a start ID as a String to it. You can pass different start IDs to play different dialogue trees present in the dialogue file (just make sure each tree has a unique start ID).
The final step is to run your game using the run button at the top or pressing F5. Click on the button to trigger the dialogue and you should see the dialogue box appear along with the speaker and the dialogue text we added earlier.
Congratulations! You just created your first dialogue and added it to your game. Now, this tutorial was written with the purpose of introducing beginners to Dialogue Nodes, and therefore, does not delve deeper into the features of the plugin. You can learn more about it from:
- Checking out the other tutorials in the wiki
- Reading the
DialogueBoxdocumentation within Godot - Experimenting! (Highly recommended)
This wiki is being updated and you can expect more tutorials soon!