👾

【Flutter/Android】通知アイコンを設定する

2022/03/30に公開

以下のデフォルトアイコンを自分で設定する

以下のサイトからアイコンを作成し、zipファイルを保存

  • 画像が既にある場合は、Imageから画像をアップロードする
    ※画像の背景は透明である必要がある
    ※色付きの画像は灰色のアイコンが表示されるので、色は設定しない

https://romannurik.github.io/AndroidAssetStudio/index.html

ダウンロードしたファイルを配置

android > app > src > main > res > drawable > 'ここに画像ファイルを配置(ex. notification_icon.png)'

Android manifest fileの編集

  • applicationタグの下に設定する
<application android:labael="">
// ここに記入
<meta-data android:name="com.google.firebase.messaging.default_notification_icon"
android:resource="@drawable/notification_icon" />

// カラー指定する場合は、以下も追記
<meta-data
android:name="com.google.firebase.messaging.default_notification_color"
android:resource="@color/symbolColor" />

カラーを指定する

  • android > app > src > main > res > value > colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="symbolColor">#DD1112</color>
</resources>

Firebaseの受信通知のアイコンを設定

  • 設定していない場合、デフォルトのアイコンで表示される
NotificationDetails(
  android: AndroidNotificationDetails(
    channel.id,
    channel.name,
    icon: "@drawable/notification_icon",
    color: 指定したい色,
  ),
),

参考文献

https://romannurik.github.io/AndroidAssetStudio/index.html

https://firebase.google.com/docs/cloud-messaging/http-server-ref

https://medium.com/nonstopio/change-the-firebase-notification-icon-in-a-flutter-245b7f7dc546

Discussion