I am attempting to make a game in unity and have been playing around with the notch of my new iPhone X. I understand that there are new safety margins that we have to now place UI elements in order to make sure they are not being cropped off by the notch or home gesture bar.
When I try and place a UI element near the top right of the screen, however, the placement is going to look different on iPhone X then on iPhone 7.
For example, if I place a UI element 35 units down and to the left of the right edge of the screen. On an iPhone7 the UI element will be placed 35 units down from the top of the usable screen whereas on the iPhoneX the UI element will be placed a total of 35 units minus the screen notch height from the top of the usable screen (lets say 5 units if the notch is 20 units)
Here is an image of what I am talking about:
SO my question is, how do I make the UI element 35 from the top of the "usable" screen? I guess the problem I have with the current solution is that if the game is run on a phone that has no notch, there will be a big blank space at the top.
So I found a solution, not a perfect solution but still a solution. I am first detecting if the device is a generation X iPhone and if this is true set the y position of the UI element to the Screen.safeArea.max.y position.
I would still like to see other solutions to this.
Here is my code:
if (UnityEngine.iOS.Device.generation == UnityEngine.iOS.DeviceGeneration.iPhoneX)
{
theImage.transform.position = new Vector2(theImage.transform.position.x, Screen.safeArea.max.y);
}