Ionic 2: Fix splash screen white screen issue

Fix issue where you see a blank screen after your splash screen disappears.

1) Install the plugin and the Ionic-Native wrapper:

$ ionic plugin add cordova-plugin-splashscreen
$ npm install --save @ionic-native/splash-screen

2) Amend 'config.xml':

  <preference name="SplashMaintainAspectRatio" value="true"/>
  <preference name="SplashScreen" value="screen"/>
  <preference name="SplashScreenDelay" value="30000"/>
  <preference name="AutoHideSplashScreen" value="false"/>
  <preference name="SplashShowOnlyFirstTime" value="false"/>
  <preference name="FadeSplashScreen" value="false"/>

3) Import SplashScreen in your 'app.module.ts' providers section:

import { SplashScreen } from '@ionic-native/splash-screen';

@NgModule({
  declarations: [...]
  imports: [IonicModule.forRoot(MyApp)],
  bootstrap: [IonicApp],
  entryComponents: [...],
  providers: [SplashScreen, ...]
})
export class AppModule {}

4) In your 'app.component.ts':

import { SplashScreen } from '@ionic-native/splash-screen';

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  constructor(
    public _app: App,
    public _platform: Platform,
    public _SplashScreen: SplashScreen) {
    this.initializeApp();
  }

5) Then in 'initializeApp()':

  initializeApp() {
    this._platform.ready().then(() => {
      // do whatever you need to do here.
      setTimeout(() => {
        this._SplashScreen.hide();
      }, 100);
    });
  }

Conclusion:

This will make the splash screen hiding entirely dependent on the platform being ready firing, then the timeout is a little extra safeguard against the flashing. Leave the 'config.xml' setting to a ridiculously high number, don't touch it.

Hope this helps, Cheers.

Source: https://ionicframework.com/docs/v2/native/splash-screen/