Application

Adobe AIR native extension

Access to application options and device information

The extension is available here: com.distriqt.Application

Documentation

Cutout Information

A display cutout is an area on some devices that extends into the display surface to allow for an edge-to-edge experience while providing space for important sensors on the front of the device.

When dealing with display cutouts the display and layout modes affect greatly how the cutouts affect your application. So it’s important that you have set the display mode before attempting to deal with cutouts. The information returned here will change based on the display mode.

Support

Android officially supports display cutouts on devices running Android 9 (API level 28) and higher.

iOS supports notches from iOS 11.

Affected

The first check you will want to perform is to determine whether the device’s display cutout will affect your view.

This will enable you to determine whether you will need to adjust your applications UI to account for the cutout.

if (Application.service.display.willCutoutAffectView)
{
    // The current view is affected by a display cutout 
}

Display Cutout

You can then retrieve information about the cutout by calling getDisplayCutout():

var cutout:DisplayCutout = Application.service.display.getDisplayCutout();

The DisplayCutout class represents the cutouts of the device. It represents the area of the application view that is not functional for displaying content.

This contains the safe distance from each edge of the device that can be used to display content relative to the current orientation.

For example in portrait, cutout.safeInsetTop will represent the height of any cutout at the top of the device.

Testing

Be sure to test all of your app’s screens and experiences. Test on devices with different types of cutouts, if possible. If you don’t have a device with a cutout, you can simulate some common cutout configurations on any device or emulator running Android 9 by doing the following:

  1. Enable developer options.
  2. In the Developer options screen, scroll down to the Drawing section, and select Simulate a display with a cutout.
  3. Select the cutout type.