Themed Icon in Android 13

Android 13 introduces many new features and APIs for developers. Today we are talking about one of them is Themed app icons. Starting with Android 13, we can opt in to themed app icons. With this feature, app icons in supported Android launchers are tinted to inherit the coloring of  our chosen wallpaper and other themes. To support this feature, our app must provide both an adaptive icon and a monochromatic app icon

Themed Icon

In Android 13 users can theme their adaptive icons. If a user has enabled themed app icons (in other words, turned on the Themed icons toggle in system settings), and the launcher supports this feature, the system uses the coloring of the user’s chosen wallpaper and theme to determine the tint color.

Adaptive Icon

An adaptive icon, or AdaptiveIconDrawable, can display differently depending on individual device capabilities and user theming. Adaptive icons are primarily used by the launcher on the homescreen, but can also be used in shortcuts, the Settings app, sharing dialogs, and the overview screen.

Steps

The first step to implementing the Themed Icons feature is to make sure that your application is already using an Adaptive Icon as its main icon asset.

Create an Adaptive Icon

👉Go File > New > Image Asset and find the option Launcher Icons (Adaptive and Legacy)

in the top drop-down menu to get yourself started.

Create a new Image Asset 

👉Right click on res > New > Image Asset.

 Or 

👉We can click on the Resource Manager tab,

 click the + icon, and select Image Asset.

👉Leave the default settings:

      Icon Type: Launcher Icons (Adaptive and Legacy)

      Name: ic_launcher

👉Click Next.

👉Click Finish.

 👉Add <monochrome android:drawable=""/> attribute

 to the <adaptive-icon> element.

👉res/mipmap-anydpi-v26/ic_launcher.xml

<?xml version="1.0" encoding="utf-8"?>

<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">

    <background android:drawable="@color/ic_launcher_mdb_background"/>

    <foreground android:drawable="@drawable/ic_launcher_mdb_foreground"/>

    <monochrome android:drawable="@drawable/ic_launcher_mdb_foreground"/>

</adaptive-icon>

👉res/mipmap-anydpi-v26/ic_launcher_mdb_round.xml

 

<?xml version="1.0" encoding="utf-8"?>

<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">

    <background android:drawable="@color/ic_launcher_mdb_background"/>

    <foreground android:drawable="@drawable/ic_launcher_foreground"/>

    <monochrome android:drawable="@drawable/ic_launcher_foreground"/>

</adaptive-icon>

Note:  If android:roundIcon and android:icon are both in our manifest, we must either remove the reference to android:roundIcon 

or

supply the monochrome icon in the drawable defined by the android:roundIcon attribute.

Thanks for reading!😊😊😊😊😊😊

If you enjoyed reading , Show some Love by

clapping 👏 on this post!

If you have any suggestion share with me.