Ionic-framework: ionic2's white screen can be solved?

Created on 25 Mar 2017  Â·  10Comments  Â·  Source: ionic-team/ionic-framework

Ionic version:

    "@angular/common": "4.0.0",
    "@angular/compiler": "4.0.0",
    "@angular/compiler-cli": "4.0.0",
    "@angular/core": "4.0.0",
    "@angular/forms": "4.0.0",
    "@angular/http": "4.0.0",
    "@angular/platform-browser": "4.0.0",
    "@angular/platform-browser-dynamic": "4.0.0",
    "@angular/platform-server": "4.0.0",
    "@ionic/storage": "2.0.1",
    "ionic-angular": "2.3.0",
    "ionic-native": "2.9.0",
    "@ionic/app-scripts": "^1.2.0",

My Phone
MeiZu Note5 (Android6.0)
Current behavior:

Ionic2 has a very obvious problem is that the app has a long time whiteScreen, this is compared with the ionic1, or very obvious, hoping to improve. of course,ionic2 has a better performance than ionic1 on view change。

The use of AOT compiled after the package is indeed better than JIT, but still whiteScreen is obvious.

# AOT compile
ionic run android --prod 
# config.xml
<preference name="SplashMaintainAspectRatio" value="true"/>
 <preference name="FadeSplashScreenDuration" value="300"/>
 <preference name="SplashScreen" value="screen"/>
 <preference name="SplashScreenDelay" value="3000"/>

Expected behavior:

Start the black and white problem can be solved

Other information:
I noticed that the dependence of ionic2 has been released with ng2, also updated to ng4, and my app has also been upgraded to 4, I now test the white screen did not have the slightest relief.

All 10 comments

Well, that just mean you are not handling splash correctly, imo.
I recommend you do:
<preference name="AutoHideSplashScreen" value="false"/>
And remove:
<preference name="SplashScreenDelay" value="3000"/>

Then in your app (assuming you are using ionic native 3+), with no angular context, do:
new SplashScreen().show();
(With no angular context - outside of any class, just import splash and run this)

Then, on platform ready (and after normally injecting splash screen), do:
this.splashScreen.hide();

That means that as long as platform is not ready, you will see a splash-screen. - no white screen

I am using ionic-native 2.9.0
npm view ionic-native and you can know that 2.9.0 is the latest version

@AmitMY it's not a good idea.

@heqiang421 For 2.9.0 you just need SplashScreen.show() which is simpler.
Why is that not a good idea?

@AmitMY Because i think white-screen is obvious due to ionic2'problem.
Your method can't solve this problem,just hide it.
thank you.

which version of @ionic/app-scripts are you using?

I also had the same issue and using app-script 1.1.4(Latest)

1.2.1 is the latest app-script version, and 3.2.4 is the latest ionic-native verison.

Hello! Thanks for opening an issue with us! As this seems like more of a support question i will urge that you ask this question on our forum or on our slack channel. Thanks for using Ionic!

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

brandyscarney picture brandyscarney  Â·  3Comments

masimplo picture masimplo  Â·  3Comments

alexbainbridge picture alexbainbridge  Â·  3Comments

fdnhkj picture fdnhkj  Â·  3Comments

giammaleoni picture giammaleoni  Â·  3Comments