[Qiita] Android 5.0 Lolipop以上で通知アイコンが白くなってしまう問題を解決する

※この記事は以前Qiitaに投稿されていた古い記事です

はじめに

AndroidのSupport LibraryにあるNotificationCompatで何気なく通知を実装したら、Android 5.0 Lolipop以上で通知アイコンが白くなってしまったので、解決方法のメモです。

アイコンが白くなってしまう通知の例

ステータスバーを開いたときの通知

アイコンからでは何の通知か判断できない…。

PRIORITY_HIGHな通知

ステータスバーを開いた時と同じで、アイコンからでは何の通知か分からない…。

ステータスバーのアイコン

文字も無いので何か全くわからない…。

何故こうなるか

Android 5.0から、アイコンをマークで使用(アルファチャンネルのみ使用)するようになったため、背景が不透明な四角い画像をSmall Iconにセットすると、勝手に白くなってしまうようになりました。
要するに、こういう画像を、

こんな感じでセットすると、

NotificationCompat.Builder builder = new NotificationCompat.Builder(context);
builder.setSmallIcon(R.drawable.icon);
// アイコンの背景色
builder.setColor(ContextCompat.getColor(context, R.color.colorPrimary));

背景が透過してしないため、画像がアルファチャンネルのみになると、このようにアイコンがただの白い四角になってしまう、というわけです。

解決方法

画像の背景を透過したアイコンを作り、それをセットします。
この画像の場合は水色の背景の部分を透明にしました。

画像修正後

画像を修正したら、実際にセットしてみます。

Small Iconだけの場合

Small Iconだけの場合は、コードは変わらず、画像だけ差し替えれば大丈夫です。

NotificationCompat.Builder builder = new NotificationCompat.Builder(context);
builder.setSmallIcon(R.drawable.icon);
// アイコンの背景色
builder.setColor(ContextCompat.getColor(context, R.color.colorPrimary));

これを実行すると、背景が透過されているので、以下のようにドロイド君の形がきれいに表示されるようになります。

ステータスバーを開いたときの通知

PRIORITY_HIGHな通知

ステータスバーのアイコン

Small IconとLarge Iconをセットした場合

NotificationCompat.Builder builder = new NotificationCompat.Builder(context);
builder.setSmallIcon(R.drawable.icon);
builder.setLargeIcon(BitmapFactory.decodeResource(context.getResources(), R.mipmap.ic_launcher));
// アイコンの背景色
builder.setColor(ContextCompat.getColor(context, R.color.colorPrimary));

これを実行すると、以下のようにLarge Iconの右下にSmall Iconが配置されて表示されます。
こちらもドロイド君の形がきれいに表示されてます。

ステータスバーを開いたときの通知

PRIORITY_HIGHな通知

ステータスバーのアイコン

通知のソース全体

上記のコードは画像のセット部分のみしか書いていませんでしたが、この通知の全体的なコードはこんな感じになります。

public static void showNotification(Context context, String contentTitle, String message, String summaryText, PendingIntent pendingIntent, boolean isLargeIcon) {
    NotificationCompat.Builder builder = new NotificationCompat.Builder(context);
    builder.setSmallIcon(R.drawable.icon);
    if(isLargeIcon) {
        builder.setLargeIcon(BitmapFactory.decodeResource(context.getResources(), R.mipmap.ic_launcher));
    }
    builder.setContentTitle(contentTitle);
    builder.setContentText(message);
    builder.setTicker(message);
    builder.setAutoCancel(true);
    builder.setDefaults(Notification.DEFAULT_VIBRATE | Notification.DEFAULT_LIGHTS);
    builder.setContentIntent(pendingIntent);
    builder.setPriority(NotificationCompat.PRIORITY_HIGH);
    builder.setColor(ContextCompat.getColor(context, R.color.colorPrimary));

    NotificationCompat.BigTextStyle bigTextStyle = new NotificationCompat.BigTextStyle(builder);
    bigTextStyle.setBigContentTitle(contentTitle);
    bigTextStyle.bigText(message);
    bigTextStyle.setSummaryText(summaryText);

    NotificationManagerCompat managerCompat = NotificationManagerCompat.from(context);
    managerCompat.notify(0, builder.build());
}

おわりに

通知の実装自体は特に変わりはなく、主に画像の修正をしただけでアイコンが白くなってしまう問題を解決できたので良かったです。
アイコンが白くなって困っている方がいましたら、ぜひ参考にしてみてください。
以上、おつかれさまでした。

参考

通知 | Android Developers
http://developer.android.com/intl/ja/design/patterns/notifications.html

https://diary.syarihu.net/2020/03/qiita-android-50-lolipop.html[Qiita] Android 5.0 Lolipop以上で通知アイコンが白くなってしまう問題を解決する