Severe UI Mobile Problems

[Willard720]

I am trying to create a portrait mobile game, but the UI is completely unpredictable and I’m having an impossible time setting it up.

This is what I get when I try to simulate mobile in the viewport options. I have already set the orientation mode to Portrait in the project menu, so I don’t get why there is so much black room, and it causes the UI to be completely misplaced.

This is what that same UI looks like in the UI editor. The whole diagram is completely misleading, considering that the bar looks like it should be half the screen, but ends up being the full length of the screen in the actual game.

I had just worked really hard to create this UI for the selected screen resolution, but, when I play it in the viewport, or simulate mobile…

I get this. I have no control over the size, scale, or location of the widgets. I’ve already tried changing the size of the viewport, via dragging the window, but that only made the UI go offscreen, and changing the anchors couldn’t fix that.

I went back into my UI and set the size to instead be for a 20" laptop, the one I have, and surely enough, I got exactly what I was seeing. So what gives? What’s the point in being able to design it for a particular size if its just gonna show me my on laptop size instead? And how do I change this so I can accurately work on my game with the UI in the place I want it to be?

[Hourences2]

So you want the UI to cover the entire screen right? Which on a mobile device would match the shape of the UI, and thus it would match without any black areas or distortion. Correct?
It should resize well if you put the anchor point of the parent widget cover the entire available space (that is the bottom right anchor option from the top of my head - the one that covers the entire tile). Possibly set the position values to 0 in case it doesn’t do that by itself. Might even have to set the size to 0. After that it should normally work, and should adjust to whatever resolution the device is trying to display the UI at.

The match 3 example has something that looks similar to your UI and might give you some ideas - UMG Best Practices | Unreal Engine Documentation

[Willard720]

Thanks for the response.

What ended up working for me was to call the Execute Console Command Node, and set the resolution there.
Then, its placed properly when I play in any sort of stand alone game, just not in the main viewport.

EDIT:

That link said I should try to use a DPI scale of 1.0, but I’ve been using 0.8 and it’s a bit too late to go back. What happens if the DPI isn’t 1.0?