DEV Community

Cover image for Step-by-step Guides to add Android App Icon
Vincent Tsen
Vincent Tsen

Posted on • Updated on • Originally published at vtsen.hashnode.dev

Step-by-step Guides to add Android App Icon

How to add new icon asset to your Android App using Asset Studio in Android Studio?

This assumes you already have the icon asset and would like to import that you into your app using Android Studio.

The following example is based on the new project template from Android Studio.

1. Delete all existing icon assets in Android Studio

  • Delete ic_launcher.background.xml and ic_launcher_foreground.xml in drawable folder. This is just an example, you could be any icon asset file format.
  • Delete all mipmap folders which consist of all the icon assets

Step-by-step_Guides_to_add_Android_App_Icon_01.gif

Tip: This step seems necessary. If I don't clean them up first, Android Studio doesn't seem to generate and overwrites the icon assets correctly. It is less messy in my opinion. You don't have mixed new and old icon assets.

2. Copy your new icon asset into the drawable folder

Step-by-step_Guides_to_add_Android_App_Icon_02.gif

Tip: This step is optional since the actual icon assets are generated later. However, I prefer to copy the icon asset file into the drawable folder so that we can keep a copy of it.

3. Generate launcher icon from image asset

  • Right-click in the project window, go to New->Image Asset

Step-by-step_Guides_to_add_Android_App_Icon_03.gif

  • Make sure the Icon Type is Launcher Icons (Adaptive and Legacy), which is the default)

  • In Foreground Layer, Source Asset, select Image Asset Type. Browse to the icon asset in the drawable the folder just now.

  • In Scaling, Resize the icon accordingly to fit in your app.

  • Go to Background Layer, change the Source Asset Type Color to white color (i.e. FFFFFF)

  • Click Next->Finish. Different screen resolution icon assets are now generated in the mipmap folders

Step-by-step_Guides_to_add_Android_App_Icon_04.gif

The default Res Directly is debug folder. Make sure you select the main folder, so you app with both debug and release variants.

Done!

Run the app, and you should see your new icon!

Step-by-step_Guides_to_add_Android_App_Icon_05.JPG


Originally published at https://vtsen.hashnode.dev.

Top comments (1)

Collapse
 
ilyamarkin1 profile image
Ilya Markin

Nice post! For beginners, I recommend reading this post how to design an app icon, here it is detailed about what the design of an app icon should be and with the help of which practices.