CODEWITHSUNDEEP
ionic2waitsplash-screen
Ali H
Ali H

Reputation: 923

White screen after splash screen in Ionic2

I have small problem with white screen after execute splash screen when I convert my application to *.apk, Its take 20 to 25 seconds then my application run fine.

So is there any settings or codes or any tools that solves this problem?

Notes

~ Application size : 19mb

~ Tested on Samsung galaxy J7 2016 - android 7.0

~ I used this way to convert my app to apk : How to generate ionic apk or ios without extra applications?

Upvotes: 1

Views: 731

Answers (2)

Duannx
Duannx

Reputation: 8746

To build your apk file just use:

ionic build android 
(or) ionic cordova build android (In ionic3)

To run your app in device just use:

ionic run android (ionic cordova run android)
(or) ionic run android --livereload (for live reload) (ionic cordova run android --livereload)

See more about ioni cli
20s launch app is normal with debug mode. Run ionic build with --prod varible, you will see your app launch much faster but it take more time to build.

Upvotes: 1

Diluk Angelo
Diluk Angelo

Reputation: 1503

by using

ionic build android --prod

The boot time will reduced to like 5 seconds and for the white screen,

the issue was Splash screen autohiding, so disable the splash screen auto hide and from

app.component.ts

i hid it manually.

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"/>

app.component.ts

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
@Component({
 templateUrl: 'app.html'
})
export class MyApp {
 rootPage:string = 'HomePage';
 constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
 platform.ready().then(() => {
 // Okay, so the platform is ready and our plugins are available.
 // Here you can do any higher level native things you might need.
 statusBar.styleDefault();
 splashScreen.hide();
 });
 }
}

Upvotes: 2

Related Questions