Hey, I'm new to Godot (1-2 months) and I'm trying to do a dynamic dialog system.
To clarify, I want the text to appear one char at a time, with was easily implemented using the visible_character property of the rich text label node (following heartbeast tutorial on dialog). the thing is that I want the dialog box to appear on top of the player talking(done) and I wanted it to slowly grow horizontally as the text appears and vertically when a certain threshold is met horizontally.
I'm struggling on that last part. since my font is not monospace and I use BBCode (some of the text will not appear but still exist in the string) it is hard to get a consistent solution.
So the question is, what the best approach to this. here some photo/video of what's happening and my tree.
the tree: https://imgur.com/a/iuyYFhk
the behaviour: https://imgur.com/a/ufaHBt6
onready var textlabel = $RichTextLabel
onready var panel = getparent().get_node("Panel")
onready var timer = $Timer
var text = ["Hey, this is a [wave]dialog box[/wave] . I know, it's pretty [color=blue]cool[/color] right?","i hope it is working [rainbow]fine[/rainbow].","it's nice outside isn't it?"]
var page = 0
marginleft = 2
marginright = 2
margintop = -20
marginbottom = -10
panel.margintop = -22
panel.marginbottom = -8
panel.marginright = 1
panel.margin_left = -1
if textlabel.getvisiblecharacters() < text[page].length():
if textlabel.getvisiblecharacters() <= 30:
marginright += 1
panel.marginleft -= 1
panel.marginright += 1
if textlabel.getvisiblecharacters() % 40 == 0 and text[page].length() - textlabel.getvisiblecharacters() > 40 :
margintop -= 10
panel.margin_top -= 10
if page == text.size()-1:
page = 0
panel.visible = false
visible = false
page += 1
So I didn't do a lot of UI in Godot so far (obviously) and what I do is that I change the margin of my rich text label and panel each time a new char is added(or each time my timer timeout).