Question

我正在使用PhoneGap Build 3.0，试图摆脱启动画面后出现的空白屏幕。

我做过研究，我所能找到的是对PhoneGap和Cordova的引用，而不是PhoneGap Build。我试过的一切都没有用 - 主要是禁用自动启动画面隐藏，并用JavaScript自动隐藏它：

在config.xml中：

<feature name="SplashScreen">
    <param name="ios-package" value="CDVSplashScreen" />
    <param name="onload" value="true" />
</feature>

在index.html中：

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8">
        window.location.href = mysite.com

        document.AddEventListener("deviceready", OnDeviceReady, false);

        function OnDeviceReady() {
            setTimeout(function() { 
                navigator.splashscreen.hide();
            }, 6000);
        };
    </script>

但这似乎忽略了我，无论如何都会自动隐藏屏幕。我认为这是因为这个解决方案不适用于PhoneGap Build，但我不确定如何解决此问题。

Answer 1

完全感受到你的痛苦。 PhoneGap Build的文档需要大量工作。我自己过去几天一直在和这个人打架。经过多次试验和错误，这对我有用。

在config.xml中：

<!-- Do not auto hide splash on iOS -->
<preference name="AutoHideSplashScreen" value="false" />
<!-- Do not auto hide splash on Android -->
<preference name="SplashScreenDelay" value="10000"/>

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

Android似乎没有AutoHide参数，所以我们只是给它一个很长的延迟。在达到这10秒之前，我们将使用JS手动隐藏它。

需要在config.xml中添加插件引用才能使javascript代码navigator.splashscreen.hide();正常工作。

另外，我发现我的项目（使用Kendo UI Mobile）在onDeviceReady内不需要setTimeout延迟。我猜，一旦你在config.xml中得到了正确的参数，你就会在你的应用中看到相同的信息。

我的onDeviceReady看起来像这样：

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

使用PhoneGap Build 3.1在iOS 6和Android 4.1上测试。

Answer 2

我想补充一点，我有一个类似的问题，在我的情况下，它不是启动画面。

在我使用PhoneGap build和Git的情况下，我在我的应用程序中添加了一个javascript文件，但未能包含并将新文件推送到我的git存储库。这导致我的应用程序在本地工作，但当构建服务器提取最新代码时，它显示PhoneGap构建上的白色屏幕。

PhoneGap初始化，但是Kendo UI不喜欢缺少引用的js类并且失败了。这是一个PhoneGap noob错误，但我想分享它只是帮助有类似问题的人和启动画面修复不起作用。 可能是您的移动ui框架加载之前发生的javascript错误。

Answer 3

如果您为应用程序使用白名单插件，则可能需要更改config.xml，如下所示才能使用phonegap构建。

<gap:plugin name="cordova-plugin-whitelist" source="npm" version="~1" />

这是我的config.xml中的cli规范。

<preference name="phonegap-version" value="cli-5.2.0" />

Answer 4

尝试在configs和html上设置背景颜色。示例蓝色：

<preference name="SplashMaintainAspectRatio" value="false" />
<preference name="SplashScreenDelay" value="1" />
<preference name="backgroundColor" value="0xff0000ff" />

和html标签

<html style="background-color:#0000ff;>

Answer 5

这是步骤

1）在 config.xml

中添加启动画面首选项

<preference
    name="SplashScreen"
    value="screen" />
<preference
    name="AutoHideSplashScreen"
    value="true" />
<preference
    name="SplashScreenDelay"
    value="5000" />

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

    <param
        name="onload"
        value="true" />
</feature>

2）在 config.xml

中声明启动画面

    <!-- you can use any density that exists in the Android project -->
    <splash
        density="land-hdpi"
        src="res/drawable-land-hdpi/splash.png" />
    <splash
        density="land-ldpi"
        src="res/drawable-land-ldpi/splash.png" />
    <splash
        density="land-mdpi"
        src="res/drawable-land-mdpi/splash.png" />
    <splash
        density="land-xhdpi"
        src="res/drawable-land-xhdpi/splash.png" />
    <splash
        density="port-hdpi"
        src="res/drawable-hdpi/splash.png" />
    <splash
        density="port-ldpi"
        src="res/drawable-ldpi/splash.png" />
    <splash
        density="port-mdpi"
        src="res/drawable-mdpi/splash.png" />
    <splash
        density="port-xhdpi"
        src="res/drawable-xhdpi/splash.png" />
</platform>

3）最后将this class添加到 org.apache.cordova.splashscreen 包

下的android项目结构中

或

将其安装为Cordova插件。

Answer 6

我在iOS上只有类似的问题，在我的情况下，它与我在 index.html 上实现样式的方式有关。在我的情况下，我必须为不同的品牌提供样式，它依赖于 $ scope 变量。我在 body 中使用了 @import ，显然iOS有问题。我通过将CSS链接返回 head 来解决它。我使用 $ rootScope 和 ng-if 来根据品牌名称触发正确的样式。不知怎的，它是在 @import 的情况下，在启动画面后显示空白的白色屏幕...我希望它可以帮助任何有相同问题的人。

Answer 7

我遇到同样的问题＆＃34;启动屏幕后出现空白屏幕＆＃34;。出于某种原因，我在模拟器iOS调试日志中收到了此消息：

deviceready has not fired after 5 seconds

已解决从我的index.html

中删除此元标记的问题

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

现在它在iOS中工作（没有在android中测试过）。 Reference #1 here!

这也是cordova-plugin-splashscreen的文档。（搜索＆＃34; iOS Quirk：＆＃34;）。 Reference #2 here!

启动画面后，PhoneGap Build iOS应用程序有空白屏幕

7 个答案: