Flutter notification icon not showing

Flutter Notification Icon Not Showing

When the notification icon is not showing in your Flutter app, it is usually due to one of the following reasons:

  1. Incorrect icon file location
  2. Invalid icon format
  3. Missing required metadata in AndroidManifest.xml

1. Incorrect Icon File Location

Make sure that your icon file is located in the correct directory. In Flutter, the notification icon should be placed in /android/app/src/main/res/drawable directory. The icon file should have a valid file name, such as ic_notification.png.

2. Invalid Icon Format

Ensure that your icon file has a valid format and meets the requirements. For Android, the notification icon should be a transparent PNG file with a recommended size of 24×24 pixels. It is also recommended to provide different size versions of the icon (e.g., 18×18, 36×36, etc.) and place them in corresponding drawable directories (e.g., drawable-hdpi, drawable-xhdpi, etc.) to support different screen densities.

3. Missing Required Metadata in AndroidManifest.xml

Check if your app’s AndroidManifest.xml file includes the necessary metadata for displaying the notification icon. Open the file located at /android/app/src/main/AndroidManifest.xml and make sure it contains the following lines:

    <!-- Inside the <application> tag -->
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_icon"
        android:resource="@drawable/ic_notification" />
  

Replace ic_notification with the actual name of your icon file (without the extension). This metadata tells the Android system which icon to use for displaying notifications.

Example:

Suppose you have an icon file named ic_notification.png and you placed it in the /android/app/src/main/res/drawable directory. In that case, the corresponding metadata entry in your AndroidManifest.xml file would be:

    <!-- Inside the <application> tag -->
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_icon"
        android:resource="@drawable/ic_notification" />
  

After making the necessary changes, rebuild your Flutter app and test the notifications. The icon should now appear correctly in the notification area.

Leave a comment