+1 vote

Hi, first of all, I am sorry if this is already taken care of in another discussion, but I have searched with no success for the answer to my problem.

I have a label where I insert text via code.
The text comes from an array of strings with each string varying its size.
If the player presses a next button, it replaces the string displayed in the label for another string from the array.

My problem is that the first string is displayed centralized, but, when the next string is of a different, it is displayed a little to the right (not centralized anymore).
And then, if the string after that is smaller, it is not displayed in the center anymore like the first one. Its as if it's displayed a few inches to the right. So, the position of the strings doesn't seem to start off from the center of the label. It varies depending on the string that came before it.

How do I fix this? I want to display the strings as the label's text always starting off from the center and filling the spaces in both directions if its bigger, so that it remains centered.

Hope I could make myself clear.

in Engine by (13 points)

1 Answer

0 votes

Possibly I found a better way to achieve this, that is:

  1. Put the Label into a CenterContainer
  2. Set the container growing in both direction

Original reply

I've got the same problem in Label node usage.

I attempted to make a label that holds an integer and is set to NOT clip or autowrap the text (since I insist to display the integer in one line).

Also this Labelis set to be:

  • Horizontal grow direction is both.
  • Margins are all 0
  • Pivot has NO offset and just remained (0,0)
  • HAlign & VAlign are both center

I found that whenever the text is getting longer, the rect will be expand to fit the max length of the new text, in which the expansion obeys the grow direction, that is, the Label expands in both direction.

However, it's not vice versa when the text is getting shorter, whence the Label just kept its dimension without any shrinkage.

The reason is that Label's position and dimension is actually determined by rect_position and rect_size (they both are Vector2s in fact, named rect_* though). The expansion did fixed both value - left pushed the rect_position and right pushed the rect_size.

There's a way to let the expanded rect_size to fit the shorter text, just reset it to zero:

rect_size = Vector2.ZERO

But that does NOT affect the rect_position(this vector is always the top-left corner of the rect), so after that you'll find the rect shrinked from the end with the left side not moved.

In that case we need to fix the position too:

# call this whenever you would like to change the text
func set_text(text:String):
        var center:Vector2 = rect_position - rect_size/2
        self.text = text
        rect_size = Vector2.ZERO
        rect_position = center - rect_size/2 # no need to worry Vector2.ZERO, the rect_size will be clamped to the minimal size

That did work. But I also wonder if there's a better or more convenient way to achieve this more easily.

by (14 points)
edited by
Welcome to Godot Engine Q&A, where you can ask questions and receive answers from other members of the community.

Please make sure to read How to use this Q&A? before posting your first questions.
Social login is currently unavailable. If you've previously logged in with a Facebook or GitHub account, use the I forgot my password link in the login box to set a password for your account. If you still can't access your account, send an email to webmaster@godotengine.org with your username.