You could just load it into a JSON or gd file and call a func like do_dialogue(block) and then do all of this for the dialogue of one "block" of dialogue. Like, the Pokémon prof oak intro is a block, interacting with a TV is a block... Etc
I watched so many other videos and they just werent as straight forward as your video. Its very well made and i aprecciate you added sections in it. You really helped, thank you! I hope you also make a video about coding for beginers cause even though i understand coding when i see it i cant seem to be able to do it without help
For some reason my keyboard is bouncing from first to last in an instant. So I added a Yield 0.1 before the function call to work. Thank you, we need more tutorials, MORE! God bless you.
Thanks for this. Trying to implement something like this is a bit daunting. With the basics in place it's easier to add functionality. UI design is hell.
Tutorial was great and it worked perfectly! If anyone tries adding this to another project and has an issue where you can't see the next-indicator, make sure you update the position animation. It took me forever to figure out why I could not see the indicator, even when I manually made it visible. I'm not sure if there is a simple way to have the position animation automatically updated based on the parent. My game had a much smaller screen so I made the DialogBox much smaller and therefore the next-indicator was going way offscreen until I fixed the position animation.
YOU ARE A FRICKIN LEDGEND THIS WAS THE BEST TUTORIAL I HAVE SEEN ON THIS TOPIC. YOU ARE BLOODY AWESOME YOU FRICKEN LEGEND. ME AND MY FRIENDS ARE WORKING ON A GAME AND YOU JUST HELPED IT SOOOO MUCH. IF MY GAME EVER GOES BIG. I WILL RECCOMEND YOUR CHANNEL IMMEDIATELY. YOU ARE AN A AMAZING MAN AND YOU DESERVE SO MUCH MORE SUBS. MADLAD!
this is a great tutorial, however, i'm a little concerned over the efficiency bc wouldn't this code only allow for one entire dialogue and also restrict the programmer to all of the dialogue in one array?
I know this comment is 11 months old, but It is possible to transfer dialogue from one array to another. I would honestly keep your dialogue is seperate scripts and transfer them to thw dialogue box array if needed.
How is the `percent_visible` property not more widely known? I'm having a meltdown in my Discord right now because I never knew this was a thing, and it's been right there staring at me...
thank you for this great tutorial. it has helped, but is there something you can add to the code so that once the dialog is finished the next click/button press will take you to the next scene? sorry i'm an amateur. i've searching but haven't much luck at the minute. i'm trying to make a cutscene between levels
If I follow the video as shown, the speed at which the text appears is proportional to the length of the sentence. Is there any way to make the text appear constant regardless of the length of the sentence?
The easiest way I can think of is to declare a variable before the tween is started. This would be a small number (like 0.1, but see what feels right) that you multiply by the length of the BBCcode or text (since strings are arrays). So you end up with a number that is 0.1 per character for the duration of the animation.
Just curious, why didn't you just create a dialog box scene? Why did you just create a main Control scene and then create the dialog box within that, as a child of the scene? I figured people would want a DialogBox.tscn and then they can drop it into any project they have. Obviously I can do that myself, and I did, but I guess I was just wondering if there a was a particular reason you didn't. Either way thanks for the tutorial, very helpful!
I have a question, how would you use this in a game? im trying to figure out how to make the textbox appear when you press a button in front of a character, and also how to make it display specific dialog. if you still read these comments could you help please?
Very usefull tutorial, but why using RichTextLabel instead of TextLabel? And also there is a way to set bbcode effects like [wave] from code? because i can't figure out how to do write the code to do it
For some reason everything work but when i press any of the ui_accept buttons it doesn't show the other messages and the code is literally the same in the video, i checked twice.
Hey Emilio, for localization of a rich-text, should I put the key value of my CSV in the text box beneath the Tab Size? I'm having difficulties trying to find out where to put my key to enable the recognition of the rich-text dialogues and display the correct language that has been selected by the player.
Hello Emilio, this is a very well made tutorial, many thanks! I have, however, encountered a strange problem trying to implement this into a larger project. Have you ever seen a situation where the editor basically does not allow the anchors to be moved, e.g. when you drag an anchor it stays in place and there is an error message 'editor/plugins/canvas_item_editor_plugin.cpp:846 - Condition "parent_rect.size.x == 0" is true. Returned: Vector2()' I made the TextureRect child of a Popup, which is a child of a Control node, which is a child of Node2D. Got this feeling that just a small tweak will get this running, but I have not figured it out yet.
Glad you were able to find a solution! The dialog in this video is very rudimentary and you should be able to modify almost any kind of node and property as you wish without breaking it too much. Another option is to create a viewport for it and show it there independently of whatever other nodes you have currently on your scene. Hope that helps!
Yeah, right now this is very static and it is not really meant for it to be resized, but I'll try to look for solutions to that problem in future videos.
Hey! I am implementing this but I want to add a typewriter effect per text character, this implementation of tween makes this kinda difficult. Any suggestions?
Hey man, awesome tutorial! everything works fine for me. I have a question: now if the first line is ended it disapears and the second line will be displayed. how can i set in the script, that the line that was displayed will still be visible and the second line apears right after?
Interesting... The code is not set up to achieve that, so it will probably require a different way of displaying the lines. A hack that I can think of is having the first dialog to show a line and then the second dialog to show both lines but start the tween mid way by counting the characters repeated and starting from there instead of starting from 0. But again, it will require some extra work to get it to work like that. I'll let you know if I find a simple solution!
@@emi_cpl hey thanks! what i did now is making a colorrect and but it on top of the text. after that i took the animationplayer and made a fade in animation. my keyframes are the size of the colorrect. so the animation will just decrease the size of the colorrect after a time. the player will see the text getting faded in part for part. i also made a timer, so after the animation is finished, the buttons will be displayed. i dont know if its the best way to do this, but i came up with this now.
my problem isn't output but rather input. you know like when your having a conversation with someone in game, then it comes time for you to reply and it gives you a list of options to pick from. that is what i need to create. i think i understand how a list works in code but not the UI element part of it. how to get the array of strings into the list and then also getting the one the person selects
@@emi_cpl basically been trying to do a text adventure thing for a while now , funnest thing is trying to figure out how to branch through the story. i would say , even though my graphics design is terrible that 3d and 2d games are far easier then a text adventure XD
What would you recommend for having it automatically advance, without waiting for player input (i.e., if I wanted messages to automatically appear when the player was near a certain object this was attached to or called from)
You can probably set up so when the "next indicator" is visible it send the action press? Not sure what the best way of implementing this would be since there are so many and it depends on what effect you want to create
Yes! I'm working on that right now, but if you are curious there are already some existing dialog editors available. Make sure to check the other videos I made on the topic :)
What about if you wanted to instance the dialoguebox scene in other scenes, would there be a way to instance it along with passing dialogue options to display?
Yes! If you see the next videos covering the dialog box you will see how I deal with that. You have the full playlist here if you are interested: th-cam.com/play/PLQsiR7DILTczTCdGt-zjPPZB-FdX4KTP7.html
Hey, thank you so much for this awesome add-on! I add this to my game but I want the dialog to show up only when I interact with NPC, I can't seem to figure out where to make a change in dialog_node.tscn. I made an instance of dialog_node in the NPC script and called load_dialog() when they interact. Unfortunately, this doesn't work. Do you have any suggestions for this?
Have you checked the latest version of the plugin? this video is quite old already. I also made a video on how to interact with an NPC that you can watch: th-cam.com/video/gZ3h09B7Utc/w-d-xo.html
7 months late, sorry, but in case you're still working on your game: no you don't have to. Godot levels are saved as scenes which can be loaded in easily, and you can change the default scene the game loads with whenever you'd like. You can develop with the first level as the default scene then switch it to the main menu later.
Hello (I'm french sorry for my english) so i try to do the same thing as you but it's write "Invalid set index 'bbcode_text' (on base :'null instance') with value of type 'String'.
You might have a typo for the name of the rich text box you are trying to change the text for. The editor is telling you that whatever you are trying to work with doesn't exist ('null instance')
You can instance the scene with code or simply place it on the node tree, it is hard to explain but I might be able to do a video later revisiting this dialog and adding a couple new features.
You have to create an instance of the dialog scene with your text every time you want to display it. Remember that when the dialog ends it will auto-remove to clear up your scene. So, imagine that the function you have here is triggered when you talk to an NPC. The code will look something like: ``` func talking_to_npc(): var d = DialogBox.instance() d.dialog = [ 'Hello there!' ] add_child(d) ``` Hope that helps!
You can store dialogs on JSON files in any system as long as you structure it the same as the final variable that you will read. I'm working on a follow up video that will include loading dialogs from external files!
from what i can tell godot doesn't handle vectors very well, if you go under theme override > normal font > settings and then select Use Filter it'll make it look a little less pixelated, not ideal but it's the best i've been able to find
Been jumping from tutorial to tutorial to get a dialogue system working, this the only one that helped. Thank you.
me 2 lol, if u know the actual way could you plz make a tut about it? i subbed!
This is the only tutorial on dialogue that was easy to follow and not overly complicated, thank you so much.
You could just load it into a JSON or gd file and call a func like do_dialogue(block) and then do all of this for the dialogue of one "block" of dialogue. Like, the Pokémon prof oak intro is a block, interacting with a TV is a block... Etc
I was just trying do a dialog box, good timing! thanks
I watched so many other videos and they just werent as straight forward as your video. Its very well made and i aprecciate you added sections in it. You really helped, thank you!
I hope you also make a video about coding for beginers cause even though i understand coding when i see it i cant seem to be able to do it without help
For some reason my keyboard is bouncing from first to last in an instant. So I added a Yield 0.1 before the function call to work. Thank you, we need more tutorials, MORE! God bless you.
Great tutorial, great explanations, and I like the speed of it!
Thanks for this. Trying to implement something like this is a bit daunting. With the basics in place it's easier to add functionality.
UI design is hell.
Wonderfully clear explanation in a sea of unhelpful ones. Thanks for the help.
Thank you very much.
This tutorial is the neatest dialog box tutorial I have ever seen. Easy to understand, thanks for your great explanation!
I like how you used Fire Emblem 3 Houses for the thumbnail
Your projects are always very useful, thank you friend, you have a great talent, I have always admired you
Thank you so much I'm really happy that they are of help!
Tutorial was great and it worked perfectly!
If anyone tries adding this to another project and has an issue where you can't see the next-indicator, make sure you update the position animation. It took me forever to figure out why I could not see the indicator, even when I manually made it visible. I'm not sure if there is a simple way to have the position animation automatically updated based on the parent. My game had a much smaller screen so I made the DialogBox much smaller and therefore the next-indicator was going way offscreen until I fixed the position animation.
YOU ARE A FRICKIN LEDGEND THIS WAS THE BEST TUTORIAL I HAVE SEEN ON THIS TOPIC. YOU ARE BLOODY AWESOME YOU FRICKEN LEGEND. ME AND MY FRIENDS ARE WORKING ON A GAME AND YOU JUST HELPED IT SOOOO MUCH. IF MY GAME EVER GOES BIG. I WILL RECCOMEND YOUR CHANNEL IMMEDIATELY. YOU ARE AN A AMAZING MAN AND YOU DESERVE SO MUCH MORE SUBS. MADLAD!
i was searching for a dialog box tutorial since so long ! Simple and clear, ty sir !
Loving your tutorials, simple yet highly informational
This is my first tutorial with you, I don't speak english but I understand your tutorial !!! Great work !!!
great video bro!!! thanks!!
Dude, this tutorial is awesome. This tutorial has all the things I need. Subscribed the channel.
You help me a lot! Thank you so much for making this video
1:30 Thank you so much. I was wondering how to use these and now I know. Thank you man...
You are a good man, thank you
Thank you for this, it's exactly what i was looking for!
This is the one that fits for me, thank you allot.
Man that was a long intro, thanks for the timestamp :D
😉
this is a great tutorial, however, i'm a little concerned over the efficiency bc wouldn't this code only allow for one entire dialogue and also restrict the programmer to all of the dialogue in one array?
I know this comment is 11 months old, but It is possible to transfer dialogue from one array to another. I would honestly keep your dialogue is seperate scripts and transfer them to thw dialogue box array if needed.
Your tutorial is great, thank you!
Amazing tutorial, you are an inspiration for my own channel
That’s amazing! Good luck with the videos 👏🏻👏🏻👏🏻
youre a lifesaver. thank you for the tutorial
Thank you very much. This is super helpful
Pretty useful tutorial, mate.
I think it's the best one here on ytb
i just subscribed :)
Thanks for the sub!
This was really useful thank you very much :-)
Very helpful - thanks
How is the `percent_visible` property not more widely known? I'm having a meltdown in my Discord right now because I never knew this was a thing, and it's been right there staring at me...
hahaha I remember finding out about it after coding it myself. Fun times.
7:05 i really had to smile
Great! Thanks man!!!!
It works, bu i don't know how put it into my game
You should check this new video th-cam.com/video/q29PlsUUAwk/w-d-xo.html
Very complete tutorial very good
Thanks! I'm glad you liked it :)
thank you for this great tutorial. it has helped, but is there something you can add to the code so that once the dialog is finished the next click/button press will take you to the next scene? sorry i'm an amateur. i've searching but haven't much luck at the minute. i'm trying to make a cutscene between levels
Good Tutorial!
but how to add it to our main scene!
If I follow the video as shown, the speed at which the text appears is proportional to the length of the sentence. Is there any way to make the text appear constant regardless of the length of the sentence?
The easiest way I can think of is to declare a variable before the tween is started. This would be a small number (like 0.1, but see what feels right) that you multiply by the length of the BBCcode or text (since strings are arrays). So you end up with a number that is 0.1 per character for the duration of the animation.
@@eerywax5631 Thanks for the kind explanation!
baller content as always.
Though i have a request for tutorial, could you teach us how to make custom editors inside the godot engine?
That is something that I always wanted to jump into, so I'll add it to the list for sure!
Thank you so much
Literally no tutorials out there that actually implementing the finished dialog box into the actual game, I'm tired...
How to add character picture as they talking 1 by 1...
Just curious, why didn't you just create a dialog box scene? Why did you just create a main Control scene and then create the dialog box within that, as a child of the scene? I figured people would want a DialogBox.tscn and then they can drop it into any project they have.
Obviously I can do that myself, and I did, but I guess I was just wondering if there a was a particular reason you didn't.
Either way thanks for the tutorial, very helpful!
I have a question, how would you use this in a game? im trying to figure out how to make the textbox appear when you press a button in front of a character, and also how to make it display specific dialog. if you still read these comments could you help please?
Very usefull tutorial, but why using RichTextLabel instead of TextLabel?
And also there is a way to set bbcode effects like [wave] from code? because i can't figure out how to do write the code to do it
you figured it yet ?
You should show how to get the text from a JSON
For some reason everything work but when i press any of the ui_accept buttons it doesn't show the other messages and the code is literally the same in the video, i checked twice.
Hey Emilio, for localization of a rich-text, should I put the key value of my CSV in the text box beneath the Tab Size? I'm having difficulties trying to find out where to put my key to enable the recognition of the rich-text dialogues and display the correct language that has been selected by the player.
Hi, is there a tutorial on how to make the character sprites appear during the dialogue?
CTRL+Click goes to docs??? 😱 wow
Hello Emilio,
this is a very well made tutorial, many thanks!
I have, however, encountered a strange problem trying to implement this into a larger project.
Have you ever seen a situation where the editor basically does not allow the anchors to be moved, e.g. when you drag an anchor it stays in place and there is an error message 'editor/plugins/canvas_item_editor_plugin.cpp:846 - Condition "parent_rect.size.x == 0" is true. Returned: Vector2()'
I made the TextureRect child of a Popup, which is a child of a Control node, which is a child of Node2D.
Got this feeling that just a small tweak will get this running, but I have not figured it out yet.
found the answer, changing the base node from Node2D to Node
Glad you were able to find a solution! The dialog in this video is very rudimentary and you should be able to modify almost any kind of node and property as you wish without breaking it too much. Another option is to create a viewport for it and show it there independently of whatever other nodes you have currently on your scene. Hope that helps!
Check out my Rakugo project for advanced dialog system and more: jebedaia.itch.io/rakugo
I'll totally take a look and if I continue with these I'll do a shout out for sure :)
How can I modify to press ui_accept to make the Tween jump to the finished state during var finished == false?
Thanks. I'm seeing if I can use this as a jumping off point for dialogs. When I resize the screen though, the text gets squished together. 🤔
Yeah, right now this is very static and it is not really meant for it to be resized, but I'll try to look for solutions to that problem in future videos.
@@emi_cpl disabling oversampling in project setting did the trick.
Can you make these dialogs stick to one side or center, or grow in a direction? And do that for contents, too? Is all this performant?
Hey! I am implementing this but I want to add a typewriter effect per text character, this implementation of tween makes this kinda difficult. Any suggestions?
Hey man, awesome tutorial! everything works fine for me. I have a question: now if the first line is ended it disapears and the second line will be displayed. how can i set in the script, that the line that was displayed will still be visible and the second line apears right after?
Interesting... The code is not set up to achieve that, so it will probably require a different way of displaying the lines. A hack that I can think of is having the first dialog to show a line and then the second dialog to show both lines but start the tween mid way by counting the characters repeated and starting from there instead of starting from 0. But again, it will require some extra work to get it to work like that. I'll let you know if I find a simple solution!
@@emi_cpl hey thanks! what i did now is making a colorrect and but it on top of the text. after that i took the animationplayer and made a fade in animation. my keyframes are the size of the colorrect. so the animation will just decrease the size of the colorrect after a time. the player will see the text getting faded in part for part. i also made a timer, so after the animation is finished, the buttons will be displayed. i dont know if its the best way to do this, but i came up with this now.
my problem isn't output but rather input.
you know like when your having a conversation with someone in game,
then it comes time for you to reply and it gives you a list of options to pick from.
that is what i need to create.
i think i understand how a list works in code but not the UI element part of it.
how to get the array of strings into the list and then also getting the one the person selects
I made a system to do that, I might do a part 2 for this video soon!
@@emi_cpl basically been trying to do a text adventure thing for a while now , funnest thing is trying to figure out how to branch through the story.
i would say , even though my graphics design is terrible that 3d and 2d games are far easier then a text adventure XD
great tutorial! just a doubt, how do I implement this into an NPC to be triggered upon pressing the ui_accept button? thanks
I did another tutorial that covers how to trigger the dialog: th-cam.com/video/q29PlsUUAwk/w-d-xo.html hope that helps!
What would you recommend for having it automatically advance, without waiting for player input (i.e., if I wanted messages to automatically appear when the player was near a certain object this was attached to or called from)
You can probably set up so when the "next indicator" is visible it send the action press? Not sure what the best way of implementing this would be since there are so many and it depends on what effect you want to create
Hey this is great! I hope to make a dialogue heavy game with some choices, how would I implement those with this system?
Yes! I'm working on that right now, but if you are curious there are already some existing dialog editors available. Make sure to check the other videos I made on the topic :)
What about if you wanted to instance the dialoguebox scene in other scenes, would there be a way to instance it along with passing dialogue options to display?
Yes! If you see the next videos covering the dialog box you will see how I deal with that. You have the full playlist here if you are interested: th-cam.com/play/PLQsiR7DILTczTCdGt-zjPPZB-FdX4KTP7.html
Is there a way to add sound to the animation when the text appears?
Hey, thank you so much for this awesome add-on! I add this to my game but I want the dialog to show up only when I interact with NPC, I can't seem to figure out where to make a change in dialog_node.tscn. I made an instance of dialog_node in the NPC script and called load_dialog() when they interact. Unfortunately, this doesn't work. Do you have any suggestions for this?
Have you checked the latest version of the plugin? this video is quite old already. I also made a video on how to interact with an NPC that you can watch: th-cam.com/video/gZ3h09B7Utc/w-d-xo.html
@@emi_cpl Hey thank you for this, I installed the latest version and got it working through one of your tutorials. This is some good stuff, Thanks ; )
so anyone can help me? i want put this dialog scene to my word 1 scene on my platformer game project
When i am making a game i have to program the main menu before the game itself or it’s not necessary?👉👈🏻
7 months late, sorry, but in case you're still working on your game: no you don't have to. Godot levels are saved as scenes which can be loaded in easily, and you can change the default scene the game loads with whenever you'd like. You can develop with the first level as the default scene then switch it to the main menu later.
Hello (I'm french sorry for my english) so i try to do the same thing as you but it's write "Invalid set index 'bbcode_text' (on base :'null instance') with value of type 'String'.
You might have a typo for the name of the rich text box you are trying to change the text for. The editor is telling you that whatever you are trying to work with doesn't exist ('null instance')
tu dois mettre d'abbord le $RichLabelText puis après .bbcoode_text = dialog[dialog_index]
How can I pause the game while a dialog is displayed?
so that my character cannot move
I think you are in luck! th-cam.com/video/q29PlsUUAwk/w-d-xo.html
Hi Emilio, thanks for Tutorials, what version of Godot is this? Thanks
Version is 3.2 stable! You can check the description of any of my videos to know which version I'm using (:
@@emi_cpl Silly me I missed that, thanks!
Hi, thanks for tutorial. How can I put it into a scene with my characters? Thanks again, bye
You can instance the scene with code or simply place it on the node tree, it is hard to explain but I might be able to do a video later revisiting this dialog and adding a couple new features.
If necessary, is there a way to hang up the conversation and get it going again?
there isn’t unless you create different timelines... I’ll explore what kind of changes I can make to make that work. Don’t promise anything 😅
@@emi_cpl Okay, thanks for answering ^^
next how to add character with mouth moving
Actually, this made me thing about moving portraits. I'll totally see if I can make this work for future versions :)
im planning to use this for youtube naration love it
So I've made this dialogue in my game, but it only works one time. how do I make it so you can get the same dialogue more than once?
You have to create an instance of the dialog scene with your text every time you want to display it. Remember that when the dialog ends it will auto-remove to clear up your scene.
So, imagine that the function you have here is triggered when you talk to an NPC. The code will look something like:
```
func talking_to_npc():
var d = DialogBox.instance()
d.dialog = [
'Hello there!'
]
add_child(d)
```
Hope that helps!
What's the best way to add a dialog system : JSON file or your system ?
You can store dialogs on JSON files in any system as long as you structure it the same as the final variable that you will read. I'm working on a follow up video that will include loading dialogs from external files!
@@emi_cpl What I don't understand is that the current tutorial works very well, so in what situations I might want to use JSON file dialogs ?
what about JSON
I made this into a plugin and it also works with json files, if you are interested it is called Dialogic
How do you make each letter in a text produce a sound like what's been done in Undertale?
nvm, I figured it out. Tween has a signal for what I need for it to do the work.
HOLY SHIT IM THE 420th LIKE!!
😎
my text is pixelised as fuck wtf
from what i can tell godot doesn't handle vectors very well, if you go under theme override > normal font > settings and then select Use Filter it'll make it look a little less pixelated, not ideal but it's the best i've been able to find
I've learned a lot, thank you very much