Download

Controlling Safe Area in Widget for iPhone X Series (+ iPad 3rd Generations)

I would like to discuss about Safe Area in iPhone X Series.

In order to comply with Apple’s “Human Interface Guidelines”, I need more complex area control.

First, let’s have a look at the Apple’s document.
iPhoneX_ElementPlacement.png
url: https://developer.apple.com/design/h…een-experience

The “Non-Safe Area” is located on both sides in Apple’s document. (of course it’s at the bottom, too but UMGSafeZone is supporting the bottom one so skip this.)
and I could see how many pixel should I set for Safe Area in Xcode.
(e.g. iPhone X, iPhone Xs, iPhone 11 Pro should leave 132px for both sides, and iPhone XR, iPhone 11 should leave 88px, etc…)

and Unreal Engine 4’s built-in “UMGSafeZones” doesn’t support like this.
Unreal SafeZone’s “Non-Safe Area” is located on one side, It’s something like below;


Unreal Engine only care about the Notch display(specifically, sensor housing area?) and home indicator.
By default, unreal only spare space on left, and if I rotate the display, the left side disappears, and only care about right side. which means, that’s just notch screen, not Safe Area.

What I want to do is, set Safe Area for both side equally, and precisely by pixel.

Does anyone solved this issue?

Thanks in advance.