Creating a Launcher Icon for Android requires exporting bitmap ( .png files) in several sizes into multiple directories. I recently started using InkScape so my graphics would scale and that is my first recommendation, use vector graphics.
If you only have a bitmap image do not despair. InkScape offers ‘Trace as Bitmap’ to convert it.
Once you have a vector graphics the image can be made any size. Android documentation indicated 864×864 pixels is a good size to work from and as I walk through exporting the bitmaps you will see why.
An Android application uses drawable-* images to support multiple screen densities (dpis). For a Launcher Icon you need to create 4 images.
mdpi – 48×48 = x1 (One pixel is one dp)
hdpi – 72×72 = x1.5 (One and a half pixels is one dp)
xhdpi – 96×96 = x2 (Two pixels is one dp)
xxhdpi – 144×144 = x3 (Three pixels is one dp)
It can go higher but this seems to be what is required to get started for today.
There is also a ‘drawable-nodpi’ directory for images that are not used to create the UI, for example a photograph.
In a work directory create the four directories. You will be using these as a holding area for icons.
Create the Launcher Icon
From within a new InkScape drawing select ‘File->Document Properties’ (shift-ctrl-D) and then from the ‘Page’ tab set the Custom size to 864×864. You can use a different size but as you will see, 864×864 makes the scaling numbers easy to remember.
Center what you wish to output in the boxed area. Anything outside the boxed area will be ignored.
Select ‘File->Export to Bitmap’. Select the ‘Page’ tab and set verify that x0 and y0 are 0.000 and x1 and y1 are 864 (assuming that is the size you set in the previous step). Set the Bitmap size to 48×48 (units set to px). Notice that the DPI is 5.0. Set the Filename to the directory you create for images and for the 48×48 size the directory is ‘drawable-mdpi’. Unless you change the name in the manifest the file will be called ic_launcher.png. Click Export.
Now, change the Bitmap size to 72×72 and the last subdirectory in the filename from mdpi to hdpi, and click ‘Export’. Note the dpi is 7.5 at this size.
Now, change the Bitmap size to 96×96 and the last subdirectory in the filename from hdpi to xhdpi, and click ‘Export’. Note the dpi is 10.0 at this size.
Now, change the Bitmap size to144x144 and the last subdirectory in the filename from xhdpi to xxhdpi, and click ‘Export’. Note the dpi is 15.0 at this size.
Now all that is left is to replace the files your application. I didn’t write directly to the application directories because overwriting the files may require Administrative permission and I prefer to copy the files into an application.
Navigate to the work directory and select the four directories. There should only be the one ic_launcher.png file in each subdirectory.
Copy the directories over the top of the applications.
Now when you launch the application you will see the new icon in use.
Automating the process
As you have seen, using the Bitmap Export dialog you can quickly output a set of icon images from a single Vector drawing. When you are ‘tweaking’ your launcher icon into perfection you may end up creating these files over and over.
Luckily InkScape can be called from the command line as demonstrated here.
Simply create a GenLauncher.bat (or .cmd) file that exports a set of .png files to the set of work directories created earlier.
inkscape –file=%1 –export-png=E:\InterDash.Android\Images\Icons\drawable-mdpi\ic_launcher.png –export-dpi=5.0 -z
inkscape –file=%1 –export-png=E:\InterDash.Android\Images\Icons\drawable-hdpi\ic_launcher.png –export-dpi=7.5 -z
inkscape –file=%1 –export-png=E:\InterDash.Android\Images\Icons\drawable-xhdpi\ic_launcher.png –export-dpi=10.0 -z
inkscape –file=%1 –export-png=E:\InterDash.Android\Images\Icons\drawable-xxhdpi\ic_launcher.png –export-dpi=15.0 -z
Now to create a new icon I make a change and then:
- Save the .svg file
- Generate the Icons from the command line
- Copy the files into the Application. NOTE: I also automated the copy but didn’t feel it added to this blog.
I hope this blog will save you time when you are looking to create a custom launcher icon.