如何在 Android 中使用 XML 作为可绘制对象创建自定义形状？

Question

Have a look at this Gist.

Above gist creates a drawable which looks like this:

Clearly in the gist, pathData property has been provided coordinates. How is this achieved, I mean, ofcourse someone doesn't found each point according to his needs.

My question : How is this achieved? Is there any tool present to do so?

Drawable like this reduces app size by avoiding to have an image instead. Also, there are questions for drawables in XML like this , this and many more but I think my Question is very different (and useful, probably).

Answer 1

You can design your SVG files using some tools such as Android Vector Asset Studio

Usually people don't write the SVG paths themselves, they use a tool or an editor where they sketch the drawing and generate the file.

Answer 2

What you have to do is to create a SVG image using an SVG editor such as Inkscape (the one I use) or if you want a more professional (and expensive) editor you can use Adobe Illustrator . You can even use a tool called svg-edit which is accessible in the browser.

After creating your required art, save your SVG file. Next goto and open Android Studio.

• Right click on the res folder (any folder where drawables are usually placed)
• Select New > Vector Asset. This opens the following window.

• Select local file

• Edit the path to direct it to the location of your svg file
• Depending on the complexity of your image, errors may be thrown (not all svg elements get converted to xml. Hence, avoid using complex art in svg, use raster images in that case).
• Android studio does some fixes on its own. So even if errors are thrown, if your image renders fine, then you are good to go.
• Click Next > adjust a few more settings > Click Finish
• Your xml vector asset has been created successfully.

Note: To ensure backward compatibility, add the following to your build.gradle

android{
         defaultConfig{
                        vectorDrawables.useSupportLibrary = true
                      }
       }
dependencies{
              compile 'com.android.support:appcompat-v7:23.2.0'
            }

Hope this has helped you. For more info see the official documentation .