Scale UI on mobile

Development Programming & Scripting Blueprint
1

I’m trying to figure out the best way to scale my UI on mobile. The context is:

  • The UI has been designed to fill different screen resolutions
  • But… 1080p on mobile should be scaling elements larger than 1080p on desktop

If I change the “application scaling” value under User Interface in the project settings this achieves what I’m after - the elements of the UI get larger but they fit neatly within the viewport. But there’s no way to set this at runtime, or per-platform. There’s also no way to set “Viewport Scale” which appears to be the same value, there’s only a getter.

If I set the “render scale” of any of my UI widget it doubles its actual size and it goes off-screen.

How do I fix this?

2

I’m pretty sure I did this for the previous game (shipped on PC and mobile) in the Engine.ini:

[/Script/Engine.UserInterfaceSettings]
UIScaleCurve=(ExternalCurve=PathToCurveAsset)

If you set a curve asset in the editor, you should see it update ini file so you can see what format it expects for the path etc.

Then you just edit each platform’s ini file (e.g. IOSEngine.ini for iOS), setting a different curve asset for each platform.

3

A curve is unnecessary if you’re using build parameters though.

I ended up adjusting a scalebox depending on platform.

2 Likes