Ionic-cli: ionic resources should generate iPhone X splash screens

[matthewlloyd]

The following two lines need to be added to packages/ationic/cli-utils/lib/cordova/resources.js in RESOURCES.ios.splash.images to generate the splash screen images for iPhone X. Otherwise, a white bar appears at the bottom of the screen underneath the splash screen on app launch.

{ name: 'Default-2436h.png', width: 1125, height: 2436, orientation: 'portrait' },
{ name: 'Default-Landscape-2436h.png', width: 2436, height: 1125, orientation: 'landscape' },

[imhoffd]

@matthewlloyd I'm not seeing this on the iPhone X simulator. I believe it uses Default@2x~universal~anyany.png.

This is likely related to this issue: https://github.com/ionic-team/ionic-v1/issues/331

Have you tried cordova-ios 4.5.4?

[matthewlloyd]

Yes, I'm seeing this with cordova-ios 4.5.4.

Note that the latest cordova-ios iOS project template expects the 2436h files to exist:

https://github.com/apache/cordova-ios/blob/master/bin/templates/project/__PROJECT_NAME__/Images.xcassets/LaunchImage.launchimage/Contents.json

and that cordova does not generate the relevant .png files, the ionic CLI should do so.

[mhartington]

The resources generator generates a launch image that is used for iPhone X and iPad Pro resolutions. The universal-anyany key means that the image will be used anywhere and will be properly scaled.

[matthewlloyd]

Steps to reproduce:

1. Create a new ionic app project: ionic start testapp blank
2. Add ios as a platform: ionic cordova platform add ios
3. Open platforms/ios/testapp.xcworkspace in Xcode.
4. Navigate to Resources/Images.xcassets and select LaunchImage.
5. Observe that the iPhone X portrait and landscape launch images are missing.

Package versions:

macbook-pro-2:testapp mil$ ionic info

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.0
    ionic (Ionic CLI) : 3.19.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.6
    Cordova Platforms  : ios 4.5.4
    Ionic Framework    : ionic-angular 3.9.2

System:

    ios-deploy : 1.9.1
    ios-sim    : 5.0.3
    Node       : v6.10.2
    npm        : 3.10.10
    OS         : macOS High Sierra
    Xcode      : Xcode 9.2 Build version 9C40b

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro

[matthewlloyd]

Since you have prematurely closed this issue, I will create another.

[aaronneon2]

I think contributors should reopen this issue and generate Default-2436h.png & Default-Landscape-2436h.png image assets because the universal splash asset doesn't display nicely on iPhone6 that are running iOS 11. The aspect ratio is maintained but I have my logo so big right in the center that it feels like right-in-the-face for my users.

Generating the required asset will have the splash asset in the proper dimensions.

[aaronneon2]

Just an update on this issue. To fix my issue with the big splash image, I had to comment out the universay-anyany splash entry in config.xml to prevent my test iPhone6 running iOS 11 to use the universal splash image. Then I manually create a Default-2436h.png splash image and included it in config.xml since ionic resource generator does not provide it.

[ogezue]

I don't have the impression that Ionic is useful for professional apps.