你能在 Cordova 中使用单个矢量图像作为适应性 Android 图标吗？

Question

你能在 Cordova 中使用单个矢量图像作为适应性 Android 图标吗？

3

我有一个使用 Cordova 原生构建的 Android 应用程序，之前使用 PNG 图像作为图标，现在我们正在尝试将其转换为自适应图标。需要说明的是 - 我很少甚至从不使用 Android Studio，但可以在必要时使用。 Cordova 文档（https://cordova.apache.org/docs/en/latest/config_ref/images.html#android）显示了引用多个图像文件用于自适应图标：

<platform name="android">
  <icon background="res/icon/android/ldpi-background.xml" density="ldpi" foreground="res/icon/android/ldpi-foreground.xml" src="res/android/ldpi.png" />
  <icon background="res/icon/android/mdpi-background.xml" density="mdpi" foreground="res/icon/android/mdpi-foreground.xml" src="res/android/mdpi.png" />
  <icon background="res/icon/android/hdpi-background.xml" density="hdpi" foreground="res/icon/android/hdpi-foreground.xml" src="res/android/hdpi.png" />
  <icon background="res/icon/android/xhdpi-background.xml" density="xhdpi" foreground="res/icon/android/xhdpi-foreground.xml" src="res/android/xhdpi.png" />
  <icon background="res/icon/android/xxhdpi-background.xml" density="xxhdpi" foreground="res/icon/android/xxhdpi-foreground.xml" src="res/android/xxhdpi.png" />
  <icon background="res/icon/android/xxxhdpi-background.xml" density="xxxhdpi" foreground="res/icon/android/xxxhdpi-foreground.xml" src="res/android/xxxhdpi.png" />
</platform>

我知道Android想要一种类似SVG的“矢量图形”图像，我可以将SVG转换为该格式。但是，Android的文档（https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive）似乎要求使用一个大小为108dp x 108dp的单个矢量图像。我不确定“dp”是什么意思，但我认为它是矢量图的相对坐标系统。

令我困惑的是，Android文档要求使用一个大小为108dp x 108dp的单个矢量图，但Cordova文档显示链接6个单独的XML文件（矢量图形图像）。为什么需要6个不同的矢量图像？那不是与初衷背道而驰吗？有没有用过此功能的人能够澄清在Cordova for Android中这6个不同图像文件的预期内容？谢谢！

- jriffel73

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- donald_i · Accepted Answer

我已经搞定了，但是Cordova的文档有点不清楚，而且"cordova prepare"这一步似乎有点问题。

你只需要一个矢量可绘制的前景图标，可以从SVG生成（正如你所说）。它应该是108 x 108个单位，并且应该有一个18个单位的安全区域边框。对于背景，我使用了纯色，但你也应该能够使用单个矢量可绘制对象。

重复在每一行中使用的原因似乎是每个行都需要有不同的备用PNG文件（就像以往一样）。

至少在撰写本文时，有几个需要注意的事项。

如果您正在使用纯色背景，您必须将颜色资源文件命名为除colors.xml之外的任何名称（与cordova文档相反）。否则，它将覆盖自动生成的本机Android colors.xml，并且cordova会给出一个关于“文本不能为空”的晦涩消息。例如，我的指定如下：文件的内容应遵循cordova文档，如下所示： #51c5d6 注意：如果（像我一样）最初将此文件命名为colors.xml，则在重命名后必须删除并重新添加Android平台。

另外，与cordova文档相反（或者至少没有提到），如果您使用矢量可绘制的前景图标，则还必须指定单色矢量图标，否则将不会使用前景图标（应用程序将回退到使用PNG src属性）。

对我来说，这看起来像是cordova-android/lib/prepare.js中使用的逻辑错误，尤其是因为没有发出错误或警告，但至少解决方法很简单。也许我只是误解了一些东西。

无论如何，以下是对我有效的配置：在处理这个问题时，我发现一些乐于助人的开发者将Android Studio用于将SVG转换为Android可绘制格式的vd-tool打包成了一个命令行二进制文件。有各种不同的版本可供选择，但Alex Lockwood的版本对我来说效果很好。这样就不必打开Studio来转换SVG，节省了很多时间。