Widget text changes position in runtime

I was trying to make a simple padlock using a widget with a single interger (first arrow will add 1000 to it, the second 100 and so on) to create a combination, but, for some reason, the text shifts slightly left at runtime. Anyone knows how to stop this from happening?
Runtime:


Widget editor:

Since the screen size is always variables. Some screens are small and some are huge, thus the resolution is not constant.

The solution to solve this problem is similar to web development. The term is the only difference here. So, the solution in UE is called “anchor”. You can anchor those widget components to one side and apply the append values on the x/y axis from there.

They both text and lock image are anchored to the middle of the screen and the text justification is set to center.
It’s also uneven in the exact same way on every single resolution I’ve tried.

Not sure exactly, but I would recommend having the arrow and character each in the same vertical box, where all that is then contained in a horizontal box like so:

How you do the rest eg Canvas with anchors is fine, The above way forces the individual components to be aligned and is easier to space out if you need.

1 Like

As what Dee_Kay_Bee have said. For this case, you need to consider using containers such as horizontal box, vertical box, or grid panel.

It will help your widget to stay organized and consistent.

1 Like