Alex Stanese
Alex Stanese

Reputation: 775

Remove White Flicker after splashscreen phonegap 3.3

How is it possible to create an app, add the splashscreen plugin, the splashscreen should disappear when the device is ready and no WHITE FLICKER to appear?? This happends on Adobe build and also on cli build on android plaform!

These are the simple steps I used over and over again for about a week to figure this thing out:

<feature name="SplashScreen">
    <param name="android-package" value="org.apache.cordova.splashscreen" />
<!--     <param name="onload" value="true" /> -->
</feature>

Now the plugin is set. To make sure that the splashscreen disappears after the devide is loadeed I added:

navigator.splashscreen.hide(); 

in index.js under function onDeviceReady

With this steps it works ok. The splashscreen shows ok, it disappears ok but a white flash appears. Why on earth is this happening? Is the splashscreen hiding before everything loads or why? I noticed that when I set the splashscreen a value for example 3 seconds, the white flash disappears but I want it to disappear as fast as the device is ready because I have another effect wich starts with the device ready and if I enter the second time in the app, this loads faster and the splashscreen just stays on unnecesarry and the effect happends underneath the splashscreen.

So how to finally solve this thing?

I also tried

<preference name="AutoHideSplashScreen" value="false" />

I tried setting the body background to black because the effect I was talking about was a black div that fades out at the start of the application.

And I also tried making webview black

<preference name="backgroundColor" value="0x000000" />

Everything without luck.

How can I solve this? I think that the easyest way out of here is to set the webview to black but my preference command is not working.

Upvotes: 7

Views: 7195

Answers (4)

Hitesh Sahu
Hitesh Sahu

Reputation: 45062

Try this it's working fine on s6 edge

<preference name="SplashScreen" value="screen" />
<preference name="FadeSplashScreen" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashScreenDelay" value="3000" />

Upvotes: 2

loganyu
loganyu

Reputation: 101

Set these values in config.xml of the app

<preference name="FadeSplashScreen" value="true" />
<preference name="FadeSplashScreenDuration" value="1.5" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="SuppressesIncrementalRendering" value="true" />

Upvotes: 0

Suhas Gosavi
Suhas Gosavi

Reputation: 2170

Try this

config.xml:

<preference name="AutoHideSplashScreen" value="false" />

<preference name="SplashScreenDelay" value="10000"/>

<gap:plugin name="org.apache.cordova.splashscreen" />

Android does not seem to have an AutoHide param. We will hide it manually.

Adding the plugin reference in the config.xml is needed for the javascript code navigator.splashscreen.hide(); to work.

document.addEventListener('deviceready', function() {
  navigator.splashscreen.hide();
});

Upvotes: 0

Joe&#39;s Ideas
Joe&#39;s Ideas

Reputation: 540

I added <preference name="SplashScreenDelay" value="10000" /> to my config.xml to make sure splash screen stays on, then navigator.splashscreen.hide() to hide it after my app's home page is created (rather than immediately after 'deviceready'). If I put it right after deviceready, I get a white flash because I conditionally change pages.

You could even do a setTimeout on the navigator.splashscreen.hide(), to a couple hundred ms (or whatever the delay time is).

Upvotes: 6

Related Questions