You have a great Android app and you need to add some icons to it, so you start reading about supporting multiple screen sizes, different densities, bitmap sizes, vector graphics…
Stop panicking, here’s the right way to Android App Icons: Vector Drawables.
This guide focuses on using vector drawables, Android 5.0 (API level 21) was the first version to officially support vector drawables with VectorDrawable and AnimatedVectorDrawable, but you can support older versions with the Android support library. Read more.
What is a vector drawable?
A vector drawable refers to a vector graphic defined in an XML file and which can be used by the Android system, this file contains a set of points, lines, curves and specification to generate all the shapes and colors that you see on your screen.
Why vector drawables?
Vector drawables are special because they can scale freely without losing any display quality, you can use a single file to show pixel perfect icons on any screen size and resolution reducing your app’s size and increasing maintainability.
Here are the steps to include your icons as vector drawables in your app:
Get your icons
First, you need to have the icons you want to use in your app in a vector format like SVG. Several icon pages and designers work with this type of icons so you should have no problem finding your icons.
You can download official Material Design Icons in SVG vector format.
Add them using Android Studio
Open your project with Android Studio and open Asset Studio by going to File > New > Vector Asset.
Here you’ll be able to browse your SVG files and set the name among other settings.
If you’d like to edit your icon before adding it like changing the color there are pretty cool vector editors out there totally free to use, personally, I like InkScape.
After you click next you’ll be asked to confirm the icon path and then you’re finished, you’ll have a new single XML file under your drawable folder which you’ll be able to use like any other drawable throughout your application and it will look pixel perfect across all devices and resolutions.
