How to Change the Android Notification Icon/Status Bar Icon for Push-notification in #flutter?

Question

I want to replace the default Icon with my own icon for Push-notifications.

Now the App show the Icon as White box .

Answer 1

Ajay's answer is correct, but to expand on it a bit:

NOTE: Before starting, make sure your icon/image has a transparent background. The solution will seem like it's not working if your image background has a color.

1. Create your mipmap notification icon. You can do this easily using Roman's Notification Icon Generator - Click on "Notification Icon Generator"

2. On the left panel, click "Image" to upload your own image or use ClipArt or text as provided.

3. After you're done, click the download button in the upper-right to download the zip file. Alternative to Roman's Notification Icon Generator, try appicon.co

4. In the zip file, your icon files will be in individual directories with the same name as your mipmap directories in your project directory (e.g., "mipmap-hdpi", "mipmap-mdpi", etc.). Move the icon files to their respective folders within your project.

5. In your AndroidManifest.xml file (located at android/app/src/main/AndroidManifest.xml), add the meta-data within the "application" tag:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.your.package">

    <application
        android:name="com.your.package.Application"
        android:label="YourAppName"
        android:icon="@mipmap/launcher_icon">

        <meta-data
          android:name="com.google.firebase.messaging.default_notification_icon"
          android:resource="@mipmap/your_icon_file_name" />

6. Save your file. You may need to stop and restart or uninstall and reinstall your app for the notification icon to start showing.

7. Your icon is probably white, so if you want to change the color you can add the following meta-data tag below the icon meta-data tag you just added:

        <meta-data
          android:name="com.google.firebase.messaging.default_notification_color"
          android:resource="@android:color/black" />

That will change the icon to black, but you can set your own colors in res/values as stated here: Android System Color Constants

Information about the meta-data tags is here: https://firebase.google.com/docs/cloud-messaging/android/receive

Answer 2

Just add a meta-data inside tag in your manifest file.

Reference

<!-- Set custom default icon. This is used when no icon is set for incoming notification messages. -->


<application
    android:name="io.flutter.app.FlutterApplication"
    android:label="When Coin"
    android:icon="@mipmap/ic_launcher">
<meta-data
   android:name="com.google.firebase.messaging.default_notification_icon"
   android:resource="@mipmap/ic_stat_ic_notification" />

NOTE: Before starting, make sure your icon/image has a transparent background. The solution will seem like it's not working if your image background has a color.

Want to generate mipmap icons, try appicon.co/

Answer 3

Once you done the steps mentioned above sometimes does not work and show default flutter icon.In this case, need to change or set Notification setting of flutter_local_notifications like this:

flutterLocalNotificationsPlugin.show(id, title, body,
      payload: payload,
      NotificationDetails(
        android: AndroidNotificationDetails(
          channel.id,
          channel.name,
          channelDescription: channel.description,
          icon: '@mipmap/your_icon_name',
        ),
          )
    );
  

for more information read this instruction

https://firebase.flutter.dev/docs/messaging/notifications