White screen after splashscreen, Ionic2, android device - ionic2

Question

I am currently developing Ionic2 app. I face a problem that after Splash screen, there is a white screen for 6-7 seconds, before app home screen.
I tried some googling but nothing works. My last attempt to solve is
hideSplashScreen() {
if(Splashscreen){
setTimeout(() => {
Splashscreen.hide();
},100)
}
};//
<preference name="SplashMaintainAspectRatio" value="true"/>
<preference name="FadeSplashScreenDuration" value="300"/>
Please help me in this issue;
EDIT:: My ionic info is
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.47
ios-deploy version: 1.8.6
OS: OS X El Capitan
Node Version: v6.3.1
Xcode version: Xcode 7.2 Build version 7C68

Answer 1

By default, the splash screen is hidden after 3 seconds (see https://github.com/apache/cordova-plugin-splashscreen#configxml). But it could be that at this moment your app is not ready.
Therefore I add always the following preference to my config.xml:
<preference name="AutoHideSplashScreen" value="false"/>
Instead, I hide it manually, as soon as the app is ready:
this.platform.ready().then(() => {
Splashscreen.hide();
});
This is working on iOS as well as on Android.

Answer 2

Updating Ionic project and change some preferences did the trick for me.
Here the changelog and infos.
1 - Update to the latest version of the Ionic CLI, Cordova and Typescript:
npm uninstall -g ionic cordova typescript
npm install -g ionic cordova typescript
2 - Update your package.json to match the following dependencies, remove existing node_modules directory, and then run npm install:
"scripts": {
"build": "ionic-app-scripts build",
"clean": "ionic-app-scripts clean",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/common": "4.0.2",
"#angular/compiler": "4.0.2",
"#angular/compiler-cli": "4.0.2",
"#angular/core": "4.0.2",
"#angular/forms": "4.0.2",
"#angular/http": "4.0.2",
"#angular/platform-browser": "4.0.2",
"#angular/platform-browser-dynamic": "4.0.2",
"#ionic-native/core": "3.6.1",
"#ionic-native/in-app-browser": "3.6.1",
"#ionic-native/splash-screen": "3.6.1",
"#ionic-native/status-bar": "3.6.1",
"#ionic/storage": "2.0.1",
"ionic-angular": "3.1.1",
"ionicons": "3.0.0",
"rxjs": "5.1.1",
"sw-toolbox": "3.4.0",
"zone.js": "0.8.9"
},
"devDependencies": {
"#ionic/app-scripts": "1.3.6",
"typescript": "2.3.2"
}
3 - Update your config.xlm with these preferences (live review is ok):
<preference name="loadUrlTimeoutValue" value="700000"/>
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
<preference name="android-minSdkVersion" value="16"/>
<preference name="BackupWebStorage" value="none"/>
<preference name="StatusBarStyle" value="default"/>
<preference name="SplashScreen" value="screen"/>
<preference name="orientation" value="default"/>
<preference name="SplashMaintainAspectRatio" value="true"/>
<preference name="FadeSplashScreenDuration" value="300"/>
<preference name="ShowSplashScreenSpinner" value="false"/>
<preference name="AutoHideSplashScreen" value="false"/>
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine"/>
<preference name="SplashScreenDelay" value="3000"/>
4 - Then I have copy/pasted some code that had been modified recently from here into my project (Ionic 2 demo and up to date app - Check the Github).
Now the application starts successfully without long splashscreen.
ps:
livereview: ionic run android -l
production: ionic run android --prod --release
Remember that you have to hide manually the splashscreen (like #Markus Wagner said) in your app.component.ts: this.platform.ready().then(() => { Splashscreen.hide(); });
EDIT: Update to Ionic v3.1.1 (2017-04-28)

Answer 3

Add the --prod flag during any of the following CLI commands:
// If iOS
ionic emulate ios --prod
ionic build ios --prod
ionic run ios --prod
// If Android
ionic emulate android --prod
ionic build android --prod
ionic run android --prod
More info of build (prepare + compile) an Ionic project for a given platform
https://ionicframework.com/docs/cli/cordova/build/

Answer 4

I’ve solved that issue by setting the correct parameters on config.xml
<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashScreenDelay" value="10000" />
<preference name="FadeSplashScreenDuration" value="1000" />
<preference name="SplashScreen" value="screen" />
<preference name="ShowSplashScreen" value="true" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="FadeSplashScreen" value="true" />
Then, on my platform.ready() instruction all I do is Splashscreen.hide();