将向量资产导入Android Studio时出错

I created a simple play-button image in Illustrator, saved it as a SVG, used an online SVG-to-Drawable converter to create an xml of the file, and then tried using Android Studio's Vector Asset tool to import the file into my project. However, when imported, one of the elements of the drawable is missing, in this case the white triangle in the middle of the circle.

我在Illustrator中创建了一个简单的点击按钮图像，将它保存为SVG，使用一个在线的SVG-to- drawable转换器来创建文件的xml，然后尝试使用Android Studio的Vector Asset工具将文件导入到我的项目中。然而，当导入时，绘制器的一个元素丢失了，在本例中是圆形中间的白色三角形。

play_circle.xml (the converted xml file)

play_circle。xml(转换后的xml文件)

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:viewportWidth="94"
    android:viewportHeight="102"
    android:width="94dp"
    android:height="102dp">
  <path
      android:pathData="M85 52.5A38.5 38.5 0 0 1 46.5 91 38.5 38.5 0 0 1 8        
52.5 38.5 38.5 0 0 1 46.5 14 38.5 38.5 0 0 1 85 52.5Z"
  android:strokeWidth="2"
  android:fillColor="#424900"
  android:strokeAlpha="0.29"
  android:fillAlpha="0.29"
  android:strokeColor="#000000"
  android:strokeMiterLimit="10" />
<path
  android:pathData="M71.39 51.63L34.81 30.51"
  android:fillColor="#ffffff" />
</vector>

play_button.svg, as created in illustrator and how it's intended to be

play_button。svg是在illustrator中创建的，以及它的用途

how it appears after being imported into android studio.Using Android Studio's Vector Asset Studio tool, you can see that the white triangle is already missing.

它是如何被导入android studio的。使用Android Studio的Vector Asset Studio工具，您可以看到白色三角形已经丢失。

3 个解决方案

#1

While converting png to svg there are some rules which we need to follow. All converters are not working fine. In my case, I found the best converter site which will give you preview image to confirm during conversion, which will ask for free registration and then you can download your svg file.

在将png转换为svg时，我们需要遵循一些规则。所有转换器都不能正常工作。在我的例子中，我找到了最好的转换器站点，它可以在转换过程中为您提供预览图像以进行确认，并要求免费注册，然后您可以下载svg文件。

Convert PNG to SVG - Which requires single sign up and allows only 2 tokens per day by single email

将PNG转换为SVG -这需要一个签名，并且每天只允许通过一个电子邮件发送2个令牌

Alternatives : Reference2 Reference3

替代品:Reference2 Reference3

After generating svg,Use the following tool to convert your svg to vector drawable (It's necessary because somehow android studio is not able to import all the formats and style generated by random converters)

生成svg之后，使用以下工具将svg转换为矢量绘制(这是必要的，因为android studio无法导入随机转换器生成的所有格式和样式)

Generate vector drawable from SVG

从SVG生成矢量绘图

I did the above steps for your image. and I created perfect vector drawable which you can directly copy to your drawable folder by creating new xml. (Tested by applying as source to imageview. Enjoy!)

我为你的形象做了以上的步骤。我创建了完美的矢量drawable，可以通过创建新的xml直接复制到drawable文件夹。(通过将源应用到imageview进行测试。享受!)

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="138dp"
android:height="151dp"
android:viewportWidth="138"
android:viewportHeight="151">

<path
    android:fillColor="#ffffff"
    android:pathData="M 0.00 0.00 L 136.94 0.00 C 136.87 48.67 136.95 97.33 136.88 146.00 C 137.12
147.64 136.29 149.93 138.00 151.00 L 0.00 151.00 L 0.00 0.00 Z" />
   <path
    android:fillColor="#c7c9b7"
    android:pathData="M 136.94 0.00 L 138.00 0.00 L 138.00 151.00 L 138.00 151.00 C 136.29 149.93
    137.12 147.64 136.88 146.00 C 136.95 97.33 136.87 48.67 136.94 0.00 Z" />
<path
    android:fillColor="#c7c9b7"
    android:pathData="M 60.36 18.50 C 77.71 16.46 95.72 22.52 108.36 34.56 C 120.55 46.19 127.59 63.12
    126.81 79.99 C 126.14 101.98 112.25 123.13 91.95 131.82 C 81.01 137.33 68.13
    138.47 56.13 136.23 C 37.74 133.08 21.41 120.27 13.46 103.43 C 7.33 90.93 6.03
    76.16 9.58 62.73 C 14.43 43.60 29.48 27.32 48.31 21.29 C 52.28 20.16 56.25 18.96
    60.36 18.50 Z" />
<path
    android:fillColor="#ffffff"
    android:pathData="M 46.98 47.96 C 46.74 46.39 47.53 43.71 49.61 44.42 C 67.56 54.69 85.44 65.06
    103.33 75.43 C 104.44 75.89 105.51 76.60 105.76 77.86 C 105.26 78.65 104.62
    79.29 103.84 79.80 C 86.11 90.08 68.32 100.27 50.60 110.59 C 49.59 111.11 48.54
    111.11 47.46 110.58 C 47.35 110.18 47.12 109.38 47.01 108.98 C 46.95 88.64 47.03
    68.30 46.98 47.96 Z" />
 </vector>

#2

When the vectors are created in sketch, then this error generally comes up. Here's an article about how to fix it.

当向量在草图中创建时，通常会出现这个错误。这是一篇关于如何修复它的文章。

#3

I could't have any of my asset understood by vector asset studio. The reason is that my system was in french. You need it in english because , is different than . in the path of the svg and it is automatically translated in the locale of your system. Try to make your system run an english locale (at the OS level - change language)

向量资产工作室无法理解我的任何资产。原因是我的系统是法语。你需要用英语，因为，和。在svg的路径中，它会自动地在您的系统的locale中进行翻译。尝试让您的系统运行一个英语语言环境(在OS级别——更改语言)

#1