[Ionic 4] iOS White Screen

Ionic Framework
1

After the default splash screen fades out, the screen stays white on a iOS device (can’t test it on simulator, a weird dashboard thing appears instead of the app). I checked for javascript errors using Safari and there was nothing on the console. In the elements tab I see the correct html but the phone screen is white. https://i.imgur.com/QFxahE3.png

Part of config.xml (not os specific)

    <preference name="AutoHideSplashScreen" value="false" />
    <preference name="ShowSplashScreen" value="false" />
    <preference name="ShowSplashScreenSpinner" value="false" />
    <preference name="ScrollEnabled" value="false" />
    <preference name="android-minSdkVersion" value="19" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="FadeSplashScreenDuration" value="1000" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="FadeSplashScreen" value="true" />
    <preference name="SplashScreen" value="screen" />
    <preference name="SplashScreenDelay" value="3000" />

On app.component.ts

  initializeApp() { 
    this.platform.ready().then(() => {
      alert('Success'); // THIS RUNS

      this.splashScreen.hide();
    });
  }

Ionic info

Ionic:

   ionic (Ionic CLI)             : 4.2.1 
   Ionic Framework               : @ionic/angular 4.0.0-beta.15
   @angular-devkit/build-angular : 0.7.5
   @angular-devkit/schematics    : 0.7.5
   @angular/cli                  : 6.1.5
   @ionic/angular-toolkit        : 1.0.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 6.4.0, ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.0, (and 9 other plugins)

System:

   Android SDK Tools : 25.2.2 
   ios-deploy        : 1.9.4
   ios-sim           : 3.1.1
   NodeJS            : v8.11.3  
   npm               : 6.2.0
   OS                : OS X El Capitan
   Xcode             : Xcode 8.2.1 Build version 8C1002

Plugins

cordova-plugin-device 2.0.2 "Device"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 2.2.0 "cordova-plugin-ionic-webview"
cordova-plugin-network-information 2.0.2-dev "Network Information"
cordova-plugin-screen-orientation 3.0.1 "Screen Orientation"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"
cordova-plugin-x-toast 2.7.2 "Toast"
es6-promise-plugin 4.2.2 "Promise"
phonegap-plugin-barcodescanner 8.0.0 "BarcodeScanner"
phonegap-plugin-mobile-accessibility 1.0.5-dev "Mobile Accessibility"
2 
<preference name="SplashScreenDelay" value="10000" />

add this it will solve issue

3

I updated the value before because it was happening on android. Now I guess I will try with a higher value.

Thanks

4

HI MaBbKhawaja -

If you set the splashscreen delay to higher value, then splashscreen will be shown till that time though if your app is ready!

My doubt is - Is it the right way to do that?

Thanks
Roopesh

5

In most cases, that solves the white screen issue most people have (between the splash screen and the first view of the app). When the app is ready, one must hide the splashcreen manually in code if the line it’s not there already.

In my case, the first view is not shown as if the splashscreen was still there blocking the view. I yet need to try a higher value for SplashScreenDelay than the previous one.

6

its not some white screen your data is being loaded at that time that is why it shows white screen

7

It didn’t work. The ready event for platform is fired, the splash screen is hidden BUT then the screen stays white.

By looking at the styles, I saw a “.ion-page-invisible” class applied to the first view. I believe it has to do with the router not working properly with my device’s OS.

8

I guess the problem was the ionic-webview 2.2~2.3 or ionic 4 not supporting iOS 9. After testing it on a physical device with iOS 10+, no more white screen.