如何为 Phonegap 应用程序设置图标以显示在 Spotlight 上？

Posted 2023-03-15

【中文标题】如何为 Phonegap 应用程序设置图标以显示在 Spotlight 上？

【英文标题】：How to set the icon to appear on Spotlight for a Phonegap App?

【发布时间】：2017-05-22 09:40:06

【问题描述】：

我正在创建一个使用 html 和 javascript 编码的应用程序，并通过 Phonegap 构建 Web 服务内置到 ios 和 android 应用程序中。

在 iOS 中通过 Spotlight 搜索应用程序时，它会显示默认的 Phonegap 图标，而不是我的应用程序图标。我需要它来显示我的应用图标。

我已经创建了不同大小的图标并像这样配置了 config.xml：

<icon src="res/logo.png"/>
<platform name="ios">
        <icon src="res/iOS/icons/[e-mail]"    />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"   />
        <icon src="res/iOS/icons/[e-mail]"   />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"   />
        <icon src="res/iOS/icons/[e-mail]"     />
        <icon src="res/iOS/icons/[e-mail]"   />
        <icon src="res/iOS/icons/[e-mail]"   />
    </platform>
<icon src="icon.png" />

然后，我把对应的文件放到了src的路径下。

还有什么我应该做的我缺少的吗？

【问题讨论】：

我已经稍微编辑了该工具，因为我被告知它错误地创建了一个 Android 图标。它应该可以正常工作。如果我的回答回答了您的问题，请接受。谢谢

【参考方案1】：

我创建了一个简单易用的工具，可让您将 PNG 图像转换为 Phonegap 的 iOS 和 Android APP 图标。

它涵盖了所有不同的尺寸，您只需上传一个 1204x1204 像素的 PNG 文件并在几秒钟内获取您的图标。

这是工具的链接：

https://vps267717.ovh.net/phonegap-assets/

至于您的问题，您需要在 config.xml 中使用以下代码：

<!-- iPhone and iPod touch -->
<splash src="Default.png" gap:platform="ios"   />
<splash src="[e-mail]" gap:platform="ios"   />


<!-- iPhone 5 / iPod Touch (5th Generation) -->
<splash src="[e-mail]" gap:platform="ios"   />



<!-- iPhone 6 -->
<splash src="[e-mail]" gap:platform="ios"   />
<splash src="[e-mail]" gap:platform="ios"   />

<!-- iPad -->
<splash src="Default-Portrait.png" gap:platform="ios"   />
<splash src="Default-Landscape.png" gap:platform="ios"   />


<!-- Retina iPad -->
<splash src="[e-mail]" gap:platform="ios"   />




<gap:plugin name="cordova-plugin-network-information" source="npm" /> 

<gap:plugin name="cordova-plugin-inappbrowser" source="npm" /> 

<icon src="icon.png" gap:role="default" />
<icon src="icons/ios/icon.png" />

<!-- iPhone 6 / 6+ -->
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- iPhone / iPod Touch  -->
<icon src="icons/ios/icon-60.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- iPad -->
<icon src="icons/ios/icon-76.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- Settings Icon -->
<icon src="icons/ios/icon-small.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- Spotlight Icon -->
<icon src="icons/ios/icon-40.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<icon src="icons/ios/[e-mail]" gap:platform="ios"   />


<!-- iPhone / iPod Touch -->
<icon src="icons/ios/icon.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- iPad -->
<icon src="icons/ios/icon-72.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- iPhone Spotlight and Settings Icon -->
<icon src="icons/ios/icon-small.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- iPad Spotlight and Settings Icon -->
<icon src="icons/ios/icon-50.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />



<!-- iPhone / iPod Touch -->
<icon src="icons/ios/icon.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />

<!-- iPhone Spotlight and Settings Icon -->
<icon src="icons/ios/icon-small.png" gap:platform="ios"   />
<icon src="icons/ios/[e-mail]" gap:platform="ios"   />



<!-- Android Icon -->
<icon src="icons/android/icon.png" gap:platform="android" gap:role="default" />
<icon src="icons/android/ldpi.png" gap:platform="android" gap:qualifier="ldpi" />
<icon src="icons/android/mdpi.png" gap:platform="android" qualifier="mdpi" />
<icon src="icons/android/hdpi.png" gap:platform="android" qualifier="hdpi" />
<icon src="icons/android/xhdpi.png" gap:platform="android" qualifier="xhdpi" />
<icon src="icons/android/xxhdpi.png" gap:platform="android" qualifier="xxhdpi" />
<icon src="icons/android/xxxhdpi.png" gap:platform="android" qualifier="xxxhdpi" />

确保图标的路径反映到您的图标上，并且一切正常。