(v2) Supporting iPhone X

Questions
1

I’m trying to enable the “fullscreen” view on the iPhone X (covers the entire surface area of the device with “the notch” compatibility) for an Cordova app and the last version of F7, but without succeeding.

I applied “viewport-fit=cover” to the viewport meta tag and the new storyboard splash screens, as reported in this post but… nothing the app open always with the black space in the “notch” area and footer:
https://blog.phonegap.com/displaying-a-phonegap-app-correctly-on-the-iphone-x-c4a85664c493

Which is the correct way to configure F7 with the last iPhone model?
Thanks.

screenshot
screenshot442×861 45 KB

2

If you have such layout then your splash screen doesn’t work. I can recommend you to use only one splash screen in your config.xml:

<!-- 2732x2732 -->
<splash src=”www/splash/ios/Default@2x~universal~anyany.png” />

And don’t forget to install https://github.com/apache/cordova-plugin-splashscreen

3

Hi,
I tried with your tricks but not works… I can’t get the “fullscreen” view on the iPhone X.
Anyway I’m testing on a “real device online service” (browserstack.com/app-live) and I’m not sure if the service is reliable (I think so because on all other devices I see exactly the same behaviour as my physical devices… but unfortunately I don’t have an iPhone X to compare the App with the latest Apple smartphone model).

Do you have an .ipa file (a F7 template where you are sure that is enable the fullscreen on iPhone X) that can I use to test on browserstack.com (and with the full template available in the section “Official Starter Templates” ready to be used as a starting point for development on iPhone X)?
Thanks!

4

I’ve fixed including these two splash images:
<splash src=”res/screen/ios/Default-2436h.png" width=“1125” height=“2436”/>
<splash src=”res/screen/ios/Default-Landscape-2436h.png" width=“2436” height=“1125”/>

I don’t know if it is a bug of PhoneGap Build or splashscreen plugin (that not generate these two images) but anyway now my App works on iPhone X.

1 Like