Safe Area & Non-Rectangular Screens

On some devices the full viewport is not displayed to the user. Mobile phones like the iPhone X have non-rectangular screens and some TV displays uses the overscan. This causes some areas to be unavailable for display.

The concept of Safe Area is to give you a fixed inner rectangle in which you can safely display content that will be drawn on screen. You are strongly discouraged from providing controls outside of this area. But your screen background could embellish edges.

In Unity the Safe Area is accessed via the Screen.

class Screen
{
    public static Rect safeArea;
}

If your game user interface is based on RectTransform we provide two components to help you adapt your UI automatically. Both components are supposed to be used on the root node of your user interface.

Auto Layout Rect Transform

If you use the Community Hub, AutoLayoutRectTransform takes the Safe Area into account.

Safe Are Rect Transform

For a basic layout SafeAreaRectTransform automatically modifies its Anchors according to the Safe Area.