向量资源工作室将多彩的.svg文件导入为黑白色

Question

我正在使用从Google 这里 找到的说明，使用新选项（2016年3月）将 .svg 文件导入 drawable 而非 .png 文件。

我的问题是，即使文件有很多颜色，该文件也会以黑白色导入。

这是由Google Chrome读取的 .svg 文件的图像：

然后，Vector Asset Studio 读取相同的文件如下所示：

在应用程序中，该图像显示为黑白色。

你知道发生这种情况的原因吗？

.svg 文件是在Adobe PhotoShop Creative Cloud上生成的，并且我正在Mac上使用Android Studio 1.5.1。

谢谢！

编辑：添加了我用于此问题的 .svg 文件的链接。

- TooManyEduardos

---

图片是否有外部CSS？Vector Asst Studio是否支持外部CSS？ - Robert Longson

呃，我也不知道这两个问题的答案。这是来自我们设计团队的信息。您有任何想法在 Photoshop 中让他们检查外部 CSS 的位置吗？ - TooManyEduardos

将文件添加到问题中。 - Robert Longson

那个文件中没有外部CSS。我不知道为什么它不显示，它应该可以工作的。我建议你在Vector Asset Studio的bugtracker上跟进这个问题。 - Robert Longson

Answer 1

我之前也遇到了同样的问题，但在网上搜索后终于找到了解决方法，如下所示：

完成 Illustrator 设计后，

1）转至文件-->另存为-->打开窗口对话框-->输入SVG名称-->点击保存

2）现在会显示 SVG 选项对话框--->在左下角单击更多选项--->在 CSS 属性下拉菜单中--->选择展示属性

此设置可以生成兼容 Android 导入且具有颜色的 SVG 代码！

对于初学者，抱歉让答案显得详细冗长。

- Vibhore Agg

---

这是答案，大家。谢谢，Vibhore。 - Ross Wardrup

你知道如何在Inkscape上保存文件吗？ - FeanDoe

对于那些在Illustrator中使用“导出屏幕”功能的人（如果您有许多图像要导出，这将非常有用），则可以通过进入高级设置（使用“导出屏幕”对话框中的齿轮图标）来实现此目的，然后在SVG下，将“样式”更改为“内联样式”。 - Aonghus Shortt

它也适用于Corel Draw。选择相同选项，选择演示属性。 谢谢啦，伙计。 - Thiago Silva

Answer 2

Android Studio的SVG导入器功能有限，只能处理非常简单的SVG文件。我认为它不支持<style>元素或class属性，因此您需要将CSS更改为XML属性。

例如：

<path class="st0" d="M163.3,10.8c2.4-0.5,6.2-0.9,10-0.9c5.5,0,9,0.9,11.6,3.1c2.2,1.6,3.5,4.1,3.5,7.5c0,4.1-2.7,7.7-7.2,9.3v0.1
    c4,1,8.7,4.3,8.7,10.6c0,3.6-1.4,6.4-3.6,8.5c-3,2.7-7.7,4-14.6,4c-3.8,0-6.7-0.3-8.5-0.5V10.8z M168.8,28.1h5c5.8,0,9.2-3,9.2-7.1
    c0-5-3.8-6.9-9.3-6.9c-2.5,0-4,0.2-4.8,0.4V28.1z M168.8,48.4c1.1,0.2,2.6,0.3,4.6,0.3c5.7,0,10.9-2.1,10.9-8.2
    c0-5.8-5-8.2-10.9-8.2h-4.5V48.4z"/>

需要更改为：

<path fill="#007299" d="M163.3,10.8c2.4-0.5,6.2-0.9,10-0.9c5.5,0,9,0.9,11.6,3.1c2.2,1.6,3.5,4.1,3.5,7.5c0,4.1-2.7,7.7-7.2,9.3v0.1
    c4,1,8.7,4.3,8.7,10.6c0,3.6-1.4,6.4-3.6,8.5c-3,2.7-7.7,4-14.6,4c-3.8,0-6.7-0.3-8.5-0.5V10.8z M168.8,28.1h5c5.8,0,9.2-3,9.2-7.1
    c0-5-3.8-6.9-9.3-6.9c-2.5,0-4,0.2-4.8,0.4V28.1z M168.8,48.4c1.1,0.2,2.6,0.3,4.6,0.3c5.7,0,10.9-2.1,10.9-8.2
    c0-5.8-5-8.2-10.9-8.2h-4.5V48.4z"/>

其余的<path>元素以此类推。

- Paul LeBeau

---

这就是我最终所做的，但显然对于更复杂的图像，即使只有几种颜色，这也会成为一个问题。不知道在Android Studio 2.0的beta版上是否能更好地解决这个问题？ - TooManyEduardos

在Inkscape中，您可以保存为“优化的SVG”，这将提供将CSS样式转换为XML属性的选项。但是，当我尝试使用它处理您的文件时，它会抛出错误。 - Paul LeBeau

哈哈，不错！我的唯一问题是我们从营销部门获取文件，他们只使用Adobe CC的东西。这个文件实际上是在Illustrator上创建的。是的，我可以在Inkscape中进行转换，但是如果颜色有所改变（或者其他任何变化），那么即使营销人员提供了正确的图像，我也要对此负责。 - TooManyEduardos

我的问题被标记为重复，但是关于只导入黑白svg作为全黑色的情况呢？是否也是同样的问题？http://stackoverflow.com/questions/36069272/imported-local-svg-vector-via-vector-asset-studio-is-all-black - Micro

Answer 3

这非常简单，你可以在将图像添加到项目后直接从你的SVG XML中更改颜色。

当你将图像添加到项目中时，SVG颜色必须是这样的：

android:fillColor="#000000"

只需要改成这样：

android:fillColor="#b3ff856d"

只是寻找android:fillColor

- Masoud Alipoor