移除PhoneGap 3.3启动画面后的白色闪烁问题

Question

如何创建一个应用程序，添加启动屏插件，并使启动屏在设备准备就绪时消失，同时不出现白屏闪烁？这种情况发生在Adobe Build和Android平台的cli构建上！

以下是我反复尝试了一周左右才摸索出来的简单步骤：

• 我创建了一个应用程序：phonegap create app
• 我添加了插件：phonegap local plugin add org.apache.cordova.splashscreen
• 我将以下内容添加到www文件夹中的config.xml文件中：

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

现在插件已经设置好了。为了确保启动画面在设备加载后消失，我添加了以下代码：

navigator.splashscreen.hide(); 

在function onDeviceReady下的index.js文件中

通过这些步骤，它可以正常工作。启动画面正常显示，正常消失，但是会出现一个白色闪烁。为什么会发生这种情况呢？是启动画面在所有内容加载前就隐藏了吗？

我注意到当我设置启动画面的值为3秒时，白色闪烁消失了，但我希望它在设备准备好时尽快消失，因为我有另一个效果，在设备准备好后开始运行，如果我第二次进入应用程序，则加载速度更快，启动画面只是不必要地停留，并且效果发生在启动画面下面。

那么如何最终解决这个问题呢？

我也尝试过

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

我试图将页面背景设置为黑色，因为我想要的效果是一个在应用程序开始时淡出的黑色div。

我还尝试让Webview变成黑色。

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

运气不好，什么都没实现。

我该如何解决这个问题？我认为最简单的方法是将Webview设置为黑色，但我的偏好命令无法起作用。

- Alex Stanese

Answer 1

我在我的config.xml中添加了<preference name="SplashScreenDelay" value="10000" />，以确保闪屏停留，然后在我的应用程序主页创建后（而不是“deviceready”之后立即）使用navigator.splashscreen.hide()隐藏它。如果我把它放在deviceready之后，因为我有条件地更改页面，所以会出现白色闪光。

你甚至可以在navigator.splashscreen.hide()上设置一个几百毫秒的setTimeout（或任何延迟时间）。

- Joe's Ideas

---

对我们来说不起作用。最新的PhoneGap上肯定有新问题。我们将使用另一种解决方法。 - UKDataGeek

Answer 2

尝试这个，它在S6 Edge上运行良好。

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

- Hitesh Sahu

Answer 3

将这些值设置在应用的config.xml中。

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

- loganyu

Answer 4

试试这个

config.xml:

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

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

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

Android似乎没有AutoHide参数。我们将手动隐藏它。

在config.xml中添加插件引用是必要的，以使JavaScript代码navigator.splashscreen.hide();正常工作。

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

- Suhas Gosavi