Set React Native App Icon When Minimized

Categories:

React Native uses your custom app icon ic_launcher.png specified in “android/app/src/main/res/mipmap-*/ic_launcher.png” as the launch icon. However, when you minimize your app, on some devices the default android logo is displayed instead of your custom app icon. It is supposed to use your launch icon unless specified otherwise, so this is most likely a bug in either Android, React Native, or the device I tested on.

React Native App Icon Minimized

React Native Custom App Icon

The solution is to move your app icon to the drawable folder instead of the mipmap one. Just create a copy of all the mimap-* folders from “android/app/src/main/res” in the same directory and name the copies drawable-*. The drawable folder should now also contain your app icon as ic_launcher.png.

Change the icon path to drawable

We now need to tell Android to use the ic_launcher.png inside the drawable folder. Open “android/app/src/main/AndroidManifest.xml” and modify the android:icon line:

<application
      ...
      android:icon="@drawable/ic_launcher"
      ...
</application>

After recompiling, your custom app icon will be used as both the launch icon and as the logo when minimized.

React Native App Icon Drawable

Hi, I'm Christoph Michel 👋

I'm a , , and .

Currently, I mostly work in software security and do on an independent contractor basis.

I strive for efficiency and therefore track many aspects of my life.