PhoneGap 闪屏，说明不清楚

Question

我最近决定在 PhoneGap 上工作，以便在多个设备上编写应用程序。每次我尝试使用插件时，它都会在谷歌上进行数小时和数百次搜索后工作......有时它对我来说根本不起作用。所以我可能对PhoneGap的基础知识不太了解。

我们来说说一个简单的插件，闪屏插件 (https://github.com/apache/cordova-plugin-splashscreen)。

关于插件说明，我知道我需要在 config.xml 中编写这些行：

<preference name="SplashScreen" value="foo" />
<preference name="SplashScreenDelay" value="3000" />
<preference name="SplashMaintainAspectRatio" value="true|false" />
<preference name="SplashShowOnlyFirstTime" value="true|false" />

但是，如果您阅读 Android 部分 (http://cordova.apache.org/docs/en/dev/config_ref/images.html) 中的链接中的说明，我应该在 config.xml 中写下这些行：

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

    <splash src="res/screen/android/splash-port-hdpi.png" density="port-hdpi"/>
    <splash src="res/screen/android/splash-port-ldpi.png" density="port-ldpi"/>
    <splash src="res/screen/android/splash-port-mdpi.png" density="port-mdpi"/>
    <splash src="res/screen/android/splash-port-xhdpi.png" density="port-xhdpi"/>
</platform>

我尝试了这两个指令，但它不起作用。我还发现了有关 PhoneGap Build 的其他说明，我想在 config.xml 中编写这些留置权：

<splash src="ldpi.png" platform="android" qualifier="ldpi" />
<splash src="mdpi.png" platform="android" qualifier="mdpi" />
<splash src="hdpi.png" platform="android" qualifier="hdpi" />
<splash src="xhdpi.png" platform="android" qualifier="xhdpi" />
<splash src="fr-xhdpi.png" platform="android" qualifier="fr-xhdpi" />
<splash src="portrait-xxhdpi.png" platform="android" qualifier="port-xxhdpi" />
<splash src="landscape-xxhdpi.png" platform="android" qualifier="land-xxhdpi" />

更让我困惑的是，如果我检查 PhoneGap 生成的“默认”config.xml，我会发现以下几行：

  <gap:splash src="www/res/screen/android/screen-ldpi-portrait.png" gap:platform="android" gap:qualifier="port-ldpi"/>
  <gap:splash src="www/res/screen/android/screen-mdpi-portrait.png" gap:platform="android" gap:qualifier="port-mdpi"/>
  <gap:splash src="www/res/screen/android/screen-hdpi-portrait.png" gap:platform="android" gap:qualifier="port-hdpi"/>
  <gap:splash src="www/res/screen/android/screen-xhdpi-portrait.png" gap:platform="android" gap:qualifier="port-xhdpi"/>

如您所见，有时源文件以“www”或“res”开头，有时我们在<platform> 元素或平台内有一个<splash> 是<splash> 元素的属性。
<splash> 和 <gap:splash> 元素有什么区别？

我对 PhoneGap API、PhoneGap Build API 和插件网页中的说明感到非常困惑。

我在 Mac 上使用 PhoneGap 5.3.9。 我使用 Android PhoneGap 应用或 PhoneGap Build (cli-5.2.0) 测试我的应用。

Answer 1

我最近开始使用 Cordova（phonegap 的开源版本），我也很挣扎。不过，我学到了一些东西，我认为这可能有助于让您更清楚地了解情况。

Phonegap 旨在让您的代码在多个平台（iOS、android 等）上运行。您在“平台”目录中看到的所有文件都适用于特定平台。如果您想对特定平台进行不影响其他平台的更改，您应该只编辑这些文件。除了在项目根文件夹中找到的配置文件之外，每个平台都有自己的 config.xml 文件。假设您不是想专门为 Android 制作启动画面，而是希望它在每个平台上看起来都一样，您应该只编辑项目根文件夹中的 config.xml。

我会尝试仅使用您发布的第一和第三块代码。第二个是针对 Android 特定的定制。我不确定第四个。

至于它不起作用，我建议您使用调试器来查明什么不起作用。调试android，我使用Chrome远程调试：https://developer.chrome.com/devtools/docs/remote-debugging

从那里，您可以查看控制台日志，它可能会告诉您有关插件未加载的信息。如果没有，它有一些工具可以用来查明插件不工作的原因（断点、日志语句）。

希望这会有所帮助！如果没有，你可以问我，也许可以提供进一步的建议。

Answer 2

使用cordova 时非常重要的一点是，决定使用cordova 还是它的变体，例如phonegap、ionic ......

如果您做出此决定，请仅遵循适当的文档，不要将其与其他文档混用，而仅使用最新的文档。 Cordova 非常发达，有很多变化。这意味着，cordova 的每一个变种都是基于旧版本的cordova。

另一个重要的一点是，变体使用其他语法，例如 phonegap 设置以

您应该在项目根目录的 config.xml 中进行项目设置。在项目的每个构建中，cordova 都会使用此设置。

在此 config.xml 中，您可以进行全局设置和平台设置。平台设置如下所示：

<platform name="android">
   // Here your settings for android
</platform>

您可以在此处找到图标和闪屏的工作设置：

http://cordova.apache.org/docs/en/dev/config_ref/images.html

如果你想拥有非常清晰的图标和闪屏，那么你应该自己创建不同的大小并使用矢量软件来实现。