Apps needs to support the notch

[Stephdidou]

All new iPhone apps will be required to support the notch in April - Neowin

I share this news with Adobe AIR Developers team.

They can be interested by it as April is coming fast, and they have to implement this function in the next AIR version..

[Lars Laborious]

Here's more on Apple's new demands: Submitting iOS apps to the App Store - Apple Developer

[chaky]

What exactly Adobe needs to implement to support the notch on the iPhone X? That has nothing to do with Adobe. Your application needs to support it, not Adobe.

[rewb0rn]

I second what chaky is saying. Our Air apps already support the iPhone X notch.

[Stephdidou]

I don't have an Iphone X so I didn't know. I just wanted to inform the developers. If it's unnecessary, my mistake sorry.

[rewb0rn]

To detect that you are running on the iPhone X, the best practice is to read out the device model. In Air this is possible with an ANE. The check for iPhone X then would look like this:

if (device.deviceModel == "iPhone10,3" || device.deviceModel == "iPhone10,6")

{

    //do notch magic

}

Here you can find the launch images: http://blogs.adobe.com/airodynamics/2015/03/09/launch-images-on-ios-with-adobe-air/

[Frédéric C.]

I'd be very interested in a recapitulation of the best ways to handle this with Air please.

Especially:

- How to detect we are running on an iPhone X (capabilities or screen resolution?)

- What is the exact name of the splash screen to be packaged with the app?

[pravishtis]

Hi,

-Can you please check once with Capabilities.os (Capabilities - Adobe ActionScript® 3 (AS3 ) API Reference) to check for iPhone X.

-Splash screens for iPhone X need to be named as - Default-812h@3x~iphone.png(Portrait) and Default-Landscape-812h@3x~iphone.png(Landscape). For more details, please refer Launch Images on iOS with Adobe AIR​.

Thanks,

Pravishti | Adobe AIR Engineering

[Frédéric C.]

Thank you all for the tips!

I'd like to detect the iPhone model without having to use an ANE, if possible.

I checked the Capabilities.os string, with the following code:

public function isiPhoneX():Boolean

{

            var os:String;

            os = Capabilities.os;

            if (os.indexOf("iPhone10,3") > -1 || os.indexOf("iPhone10,6") > -1)

            {

                return (true);

            }

            else

            {

                return (false);

            }

}

However, on the iPhone X simulator, the "os" string is "iPhone OS 11 x86_64". Is it because of the simulator? If I use the code above on a real device, will it work? Thank you very much!     

[pravishtis]

The string os is "iPhone OS 11 x86_64" because of the simulator. On the real device, this code will work.

Thanks,

Pravishti | Adobe AIR Engineering

[siriluna]

what about the safe area? how can I enable this? If I use the Launchscreen for iPhone X the App is nicht within safe area

[IGZN]

Currently I'm using the display size to detect if it's an iPhoneX. 2436px is the height (or 812pt if you consider contentScaleFactor). All my apps look good on iPhoneX, basically you need some additional padding at the sides for the notch and the home button

[Colin Holgate]

I just finished an app update where one of the things we did was to support iPhone X better. I did at first use the Simulator (I want to write an article on how to get Simulator to test AIR apps on iPhone X!), but then I got a real iPhone X. That made testing quicker, as well as clearly seeing the notch.

Aside from having to create extra width on a lot of the graphics, I had the problem of placement of buttons. Up until iPhone X (and S8/S9), I was able to rely on there being no devices wider than 16:9, and so my left side buttons (this is for a landscape app) could be placed at where the left edge of a 16:9 screen would be. For iPhone X that had two problems; the button wouldn't be as far left as it could be, and in the case of a vertically centered button it would be under the notch.

Here is how I know the ratio of the screen:

var screenwidth:Number = Math.max(Capabilities.screenResolutionX, Capabilities.screenResolutionY);

var screenheight:Number = Math.min(Capabilities.screenResolutionX, Capabilities.screenResolutionY);

var screenratio:Number = screenheight / screenwidth;

I then set the left arrow button to the bottom of the screen if it's a screen as wide as iPhone X:

if(screenratio<(.562)) left_arrow.y = 455;

So, in working this way I don't have to worry about the screen size, just its ratio. It does mean that Android phones that are as wide as iPhone X (none of them are yet) would have the button sat somewhere to avoid a notch that isn't there, but it looks fine anyway.

I'm pretty sure an Android phone maker will start having notches one day!

[Lars Laborious]

Colin, did you ever try the Capabilities.os on a real iPhone X? Also it would be really great if you wrote that article on how to use the Simulator to test AIR apps on iPhone X  

[Colin Holgate]

I just tried (I checked the screen height too):

Without correct splash screen: iPhone OS 11.4.1 iPhone10,6 960

With correct splash screen: iPhone OS 11.4.1 iPhone10,6 2436