How to make a lable look like paper

Help
1

Godot Version

Godot Engine v4.2.1.stable.official.b09f793f5

Question

I am making a game where you play in a restaurant, to you take the customer’s orders. Those orders appear as labels in a side window, and should look like paper, cut out of a notebook.

I want these to have a red vertical line and a blue horizontal line beneath each line of text. I am using a theme to set the StyleBoxTexture with the image I made, but it always seems to break the allignment at some point.

Probably the biggest issue is that any special characters like “ã” can break the allignment due to the font having different sizes for these caracters. For each line that has one of those, the allignment is further broken.

I think this approach of messing with numbers in the margins of the StyleBoxTexture isn’t the right way to solving the issue, because even if I manage to land the perfect numbers that seem to fix the allignment (which I did), it may still break in a different device, which happened while testing in my phone.

Here’s a screenshot of the whole thing:

image
image1917×1047 238 KB

1 Like
2

Could you make labels for each line with a minimum height that exceeds the largest character? You would also need a little restructure to MarginContainer/PanelContainer/VBoxContainer/Labels.

1 Like
3

Sorry for the delayed response.

I am avoiding that, since it makes the code a lot more complex. It could be done, I just don’t see it as the correct choice. The way it is right now, the script ony needs to set one single string variable and it is done. I will try to implement the solution you gave me, but I would like to know if there are any other options available.