AndroidStudio导入SVG出错：ERROR@<mask>不受支持。

Question

AndroidStudio导入SVG出错：ERROR@<mask>不受支持。

android-studiosvgvectorideandroid-vectordrawable

33

当我尝试导入SVG时，收到消息"ERROR@ <mask> is not supported"

 Android Studio 3.0.1
Build #AI-171.4443003, built on November 10, 2017
JRE: 1.8.0_152-release-915-b08 x86_64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
Mac OS X 10.12.6

有没有办法导入SVG并使它们正确显示？

- UmAnusorn

1

移除遮罩元素和遮罩属性？ - Robert Longson

5个回答

7

工具1) 是ShapeShifter，网址为https://shapeshifter.design

工具2) 是https://svg2vector.com

在此案例中，请尝试使用此工具https://svg2vector.com。当使用Android矢量资源工作室时，您可能会遇到以下错误：

Missing "viewBox" in <svg> element
<animate> is not supported
<animateColor> is not supported
<animateMotion> is not supported
<animateTransform> is not supported
<mpath> is not supported
<set> is not supported
<a> is not supported
<defs> is not supported
<glyph> is not supported
<marker> is not supported
<mask> is not supported
<missing-glyph> is not supported
<pattern> is not supported
<switch> is not supported
<symbol> is not supported
<feBlend> is not supported
<feColorMatrix> is not supported
<feComponentTransfer> is not supported
<feComposite> is not supported
<feConvolveMatrix> is not supported
<feDiffuseLighting> is not supported
<feDisplacementMap> is not supported
<feFlood> is not supported
<feFuncA> is not supported
<feFuncB> is not supported
<feFuncG> is not supported
<feFuncR> is not supported
<feGaussianBlur> is not supported
<feImage> is not supported
<feMerge> is not supported
<feMergeNode> is not supported
<feMorphology> is not supported
<feOffset> is not supported
<feSpecularLighting> is not supported
<feTile> is not supported
<feTurbulence> is not supported
<font> is not supported
<font-face> is not supported
<font-face-format> is not supported
<font-face-name> is not supported
<font-face-src> is not supported
<font-face-uri> is not supported
<hkern> is not supported
<vkern> is not supported
<linearGradient> is not supported
<radialGradient> is not supported
<stop> is not supported
<ellipse> is not supported
<polyline> is not supported
<text> is not supported
<use> is not supported
<feDistantLight> is not supported
<fePointLight> is not supported
<feSpotLight> is not supported
<altGlyph> is not supported
<altGlyphDef> is not supported
<altGlyphItem> is not supported
<glyphRef> is not supported
<textPath> is not supported
<tref> is not supported
<tspan> is not supported
<clipPath> is not supported
<color-profile> is not supported
<cursor> is not supported
<filter> is not supported
<foreignObject> is not supported
<script> is not supported
<view> is not supported

- Kirill Vashilo

这些错误是由什么引起的Android Studio？ - IgorGanapolsky

6

打开SVG文件并删除mask元素，可以保留use元素。
导入
打开导入的文件
删除带有fillType="evenOdd"的最后一个元素
更新android:fillType="nonZero"元素上的颜色

当然这取决于设计师如何导出资源，但像这样编辑路径通常会让您达到想要的效果。

- VonSchnauzer

几乎了解，但元素是圆形的，最终变成了正方形。 - htafoya

6

如果你只有 .svg 文件，你可以手动操作 .svg 标记来删除蒙版并内联应用填充。如果你正在与设计师合作，你可以要求他们拿走图标并删除蒙版中的任何内容，然后将填充应用到图标上。然后让设计师导出 .svg 文件并重试在 Android Studio 中导入。当你尝试导入的资产是从像 Sketch 或其他设计软件导出的，并且图标是一个蒙版（而不是填充），它会导出该标记。Android Studio 只接受带有填充的 .svg（这在 iOS 上不是问题）。

- velasco622

0

在我的情况下，这是因为Sketch中的符号覆盖造成的。这是一种已知的技术，可以轻松更改符号的颜色。它要求您在符号内部使用（颜色）符号（嵌套符号）作为掩模。这就是导致问题的掩模。

我的解决方案很简单，只需创建原始符号的导出版本，并删除掩模即可。

- jessems

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

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

- UmAnusorn · Accepted Answer

解决方案1

在Sketch中扁平化图像并使用此网站将SVG转换为Android的xml格式。

解决方案2

我使用nonZero而不是evenOdd，并在Sketch中打开它以反转顺序，反转后将更改pathData并删除android:fillType，在Android 21+上所有内容都正常工作。

解决方案3

PNG

TLDR

经过一些研究，我发现矢量图形、SVG的fill-rule属性有两种方法，“evenodd”和“nonzero”

我在Sketch中打开SVG图标并检查图标顶部的孔。如预期所用，它使用fill-rule:evenodd属性。现在我必须更改fill-rule以使用“nonzero”属性。如何操作？选择路径。在右侧，“填充”属性处有一个设置图标。单击它并选择“non-zero”。

从主菜单中，选择Layer → Paths → Reverse Order。我将孔重新放回到图标的顶部，并在应用程序中得到了孔。

欲了解更多详情