v4.4.1.stable.official [49a5bc7b6]
I wanted to create some virtual buttons for interacting with the game on a touchscreen from a browser. I only need simple directional buttons, using the following ASCII characters:
← (U+02190)
↑ (U+02191)
→ (U+02192)
↓ (U+02193)
However, for some reason, the up and down arrows look centered, but the left and right arrows do not. I have all buttons set to the same “minimum size” but it still looks off. Why?
Have you checked that the characters of the horizontal arrows are actually perfectly centered to begin with? This is what they look on the forum →↑
None of your buttons are vertically centered. There’s a larger gap at the top than the bottom even on the up and down arrows.
Do you have the vertical alignment set to center for the text?
They’re ASCII characters, not sure how to check if they are aligned or not. It’s a single character.
All of my buttons are centered.
Vertical alignment is set to centered, and the text is also set centered.
It could well be the glyphs themselves, then.
You might have more luck with the “black arrow” set in unicode: U+2B05, U+2B06, U+2B07, U+2B95. I think their glyphs may be more centered, and they’re less weedy.
Unfortunately even these aren’t centered properly. This might be an issue with how Godot handles ASCII stuff?
Either way, for now, I just decided to use SVGs and set that as an icon on the buttons.
That’s probably for the best, or pngs. There are far fewer things to go pear-shaped than with fonts.
If you’re curious about what went wrong originally, it might be worth setting a background color on the font version and see what the background rect around the glyph looks like.
