How to create vector drawables for android?

Question

I am new to VectorDrawables.

I can see that the default vector drawables provided with android studio like ic_menu_gallery,

Answer 1

Here is the best method to convert any png/jpg into vector drawable:

1. Download the software InkScape

2. Open your png in it and follow the procedure shown in the video to convert it to svg

3. The use the SVG to Vector Drawable tool to convert the svg to vector drawable. The other tool svg2android does not always work as sometimes the svg gets improperly converted to a vector drawable

4. Copy the code into a new drawable resource file. Now this can be used as a regular drawable.

If you already have a svg then start straightaway from step 3.

Answer 2

Try this : Step 1: Drawable > New > Vector Asset

Select clip art ( to use existing icon) Select from local file choose and add.You can add the color icon in sane way.

Answer 3

I had this problem too and found this very useful website:

https://materialdesignicons.com/

There are many icons and with the "advanced export" you can edit the settings easily. For me it was the fastest and easiest way to create vector drawable, if you don't want to download the file, you can just view the code and copy it, not only as a vector drawable but even as an SVG or XAML. Oh and it's free:)

1. Pick an icon
2. Click on Advanced Export
3. Edit the settings
4. Click on "View Vector Drawable" or download it and put it in your project:)

Answer 4

You can use Android Studio. Convert png to svg file online tools PNG to SVG

For SVG color can use :

  <ImageButton
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:id="@+id/button"
    android:src="@drawable/ic_more_vert_24dp"
    android:tint="@color/primary" />

Or

imageView.setColorFilter(getResources().getColor(android.R.color.black), PorterDuff.Mode.SRC_IN);

Can convert SVG to PNG online tool: coolutils

Convert SVG to Android drawable: inloop

Answer 5

you can create your own svg image or icon using photoshop/illustrator and can import vector asset (available in android studio 2.+). some times importing it results distorted image if svg is complex or has many elements then you can use it as single single element as vector assets by overlapping ImageViews.

Answer 6

Step 1 The first step is to convert it into SVG format - For black and white SVG convertor there are many tools but there are very few good tools for coloured conversion. https://www.autotracer.org/ is one of the best and it worked for me. Convert and download the SVG file. Step 2- In the ' Android Studio ' Go to drawables folder and right click to select New - Vector Asset

Step 3 - Choose the downloaded SVG file from Step 1. The android Studio

Step 4 - Dont forget to set navigationView.setItemIconTintList(null); as null in case the coloured icons are being used in a navigation drawer/view.

Cheers!!