Android Push Notifications Icon not displaying in notification white square shown instead

Question

My app generates a notification  but the icon I set for that notification is not being displayed  Instead  I get a white square  I have tried resizing the png of the icon  dimensions 720x720  66x66  44x44  22x22   Curiously  when using smaller dimensions the white square is smaller  I have googled this problem  as well as the correct way of generating notifications  and from what I ve read my code should be correct  Sadly things are not as they should be  My phone is a Nexus 5 with Android 5 1 1  The problem is also present on emulators  a Samsung Galaxy s4 with Android 5 0 1 and a Motorola Moto G with Android 5 0 1  both of which I borrowed  and don t have right now  The code for notifications follows  and two screenshots  If you require more information  please feel free to ask for it  Thank you all   SuppressLint  quot NewApi quot   private void sendNotification String msg  String title  String link  Bundle bundle        NotificationManager notificationManager    NotificationManager  getSystemService NOTIFICATION SERVICE       Intent resultIntent   new Intent getApplicationContext    MainActivity class       resultIntent putExtras bundle       PendingIntent contentIntent   PendingIntent getActivity this  0              resultIntent  Intent FLAG ACTIVITY NEW TASK       Notification notification      Uri sound   Uri parse  quot android resource    quot    getPackageName      quot   quot    R raw notificationsound       notification   new Notification Builder this                   setSmallIcon R drawable lg logo                   setContentTitle title                   setStyle new Notification BigTextStyle   bigText msg                    setAutoCancel true                   setContentText msg                   setContentIntent contentIntent                   setSound sound                   build        notificationManager notify 0  notification

User · Answer

I just converted my png to a transparent png and then the icon was the same shape as the picture  but not the same color

User · Answer

Try this  i was facing same issue i tried lot of anwers but didn t get any solutions finally i found the way to solve my problem    - make notification icon with transparent background  The app s width and height must be like below sizes and paste all these in your project- app- src- main- res   MDPI 24 24 HDPI 36 36 XHDPI 48 48 XXHDPI 72 72     after the above paste this below line in your onMessageReceived method    Intent intent   new Intent this  News class               intent addFlags Intent FLAG ACTIVITY CLEAR TOP               PendingIntent pendingIntent   PendingIntent getActivity this  0  intent                      PendingIntent FLAG ONE SHOT               Uri defaultSoundUri   RingtoneManager getDefaultUri RingtoneManager TYPE NOTIFICATION               NotificationCompat Builder notificationBuilder   new NotificationCompat Builder this               if  android os Build VERSION SDK INT  gt   Build VERSION CODES LOLLIPOP                                notificationBuilder setSmallIcon R drawable notify                                                       setContentTitle title                                                         setContentText message                           setAutoCancel true                           setSound defaultSoundUri                           setContentIntent pendingIntent                 else                                       notificationBuilder setSmallIcon R drawable notify                                                            setContentTitle title                                                     setContentText message                               setAutoCancel true                               setSound defaultSoundUri                               setContentIntent pendingIntent                             NotificationManager notificationManager                        NotificationManager  getSystemService Context NOTIFICATION SERVICE               notificationManager notify 0  notificationBuilder build       Don t forget to add this code in manifest file   lt meta-data  android name  com google firebase messaging default notification icon   android resource   drawable app icon    gt

User · Answer

When you want keep colorful icon - Workaround Add pixel with slightly different color into icon  In my case a have black icon with shades and light  When added dark blue pixel it works

User · Answer

Notifications are greyscale as explained below  They are not black-and-white  despite what others have written  You have probably seen icons with multiple shades  like network strength bars   Prior to API 21  Lollipop 5 0   colour icons work  You could force your application to target API 20  but that limits the features available to your application  so it is not recommended  You could test the running API level and set either a colour icon or a greyscale icon appropriately  but this is likely not worthwhile  In most cases  it is best to go with a greyscale icon   Images have four channels  RGBA  red   green   blue   alpha   For notification icons  Android ignores the R  G  and B channels  The only channel that counts is Alpha  also known as opacity  Design your icon with an editor that gives you control over the Alpha value of your drawing colours   How Alpha values generate a greyscale image    Alpha   0  transparent      These pixels are transparent  showing the background colour  Alpha   255  opaque      These pixels are white  Alpha   1     254     These pixels are exactly what you would expect  providing the shades between transparent and white    Changing it up with setColor    Call NotificationCompat Builder setColor int argb   From the documentation for Notification color      Accent color  an ARGB integer like the constants in Color  to be applied by the standard Style templates when presenting this notification  The current template design constructs a colorful header image by overlaying the icon image  stenciled in white  atop a field of this color  Alpha components are ignored    My testing with setColor shows that Alpha components are not ignored  Higher Alpha values turn a pixel white  Lower Alpha values turn a pixel to the background colour  black on my device  in the notification area  or to the specified colour in the pull-down notification

User · Answer

I have resolved the problem by adding below code to manifest        lt meta-data         android name  com google firebase messaging default notification icon          android resource   drawable ic stat name    gt        lt meta-data         android name  com google firebase messaging default notification color          android resource   color black    gt    where ic stat name created on Android Studio Right Click on res    New   Image Assets    IconType Notification   And one more step I have to do on server php side with notification payload    message          message    gt             notification    gt                 body     gt   title                 title    gt   message                      token    gt   token        android    gt                notification    gt                 sound     gt   default                icon     gt   ic stat name                                    data    gt                 title    gt   title               message    gt   message                         Note the section       android    gt                notification    gt                 sound     gt   default                icon     gt   ic stat name                            where icon name is  icon     gt   ic stat name  should be the same set on manifest

User · Answer

To reduce SDK specific versions  you could simply do this   replace     to  0x    Notification notification   new NotificationCompat Builder this   notification setSmallIcon R drawable icon transperent   notification setColor 0x169AB9     for color   169AB9

User · Answer

You can use different icon for different versions  Simply set logic on your icon like this   int icon   Build VERSION SDK INT  gt   Build VERSION CODES LOLLIPOP   R drawable colored   R drawable white tint icon for lolipop or upper

User · Answer

Android Studio 3 5  If you re a recent version of Android Studio  you can generate your notification images  Right click on your res folder   New   Image Asset  You will then see Configure Image Assets as shown in the image below  Change Icon Type to Notification Icons  Your images must be white and transparent  This Configure Image Assets will enforce that rule     Important  If you want the icons to be used for cloud push notifications  you must add the meta-data under your application tag to use the newly created notification icons      lt application gt                   lt meta-data android name  com google firebase messaging default notification icon            android resource   drawable ic notification    gt

User · Answer

For SDK    23  please add setLargeIcon  notification   new Notification Builder this               setSmallIcon R drawable ic launcher               setLargeIcon context getResources    R drawable lg logo                setContentTitle title               setStyle new Notification BigTextStyle   bigText msg                setAutoCancel true               setContentText msg               setContentIntent contentIntent               setSound sound               build

User · Answer

We can do like below    Create a new object of notification builder and call setSmallIcon   using notification builder object like in below code    Create a method in which we will check on which OS version we are installing our app   If it is below Lolipop i e API 21 then it will take the normal app icon with background color else it will take the transparent app icon without any background  So the devices using os version    21  will set the background color of icon using method setColor   of Notification builder class    Sample Code   NotificationCompat Builder notificationBuilder   new NotificationCompat Builder this    notificationBuilder setSmallIcon getNotificationIcon notificationBuilder     private int getNotificationIcon NotificationCompat Builder notificationBuilder        if  Build VERSION SDK INT  gt   Build VERSION CODES LOLLIPOP                 int color   0x008000               notificationBuilder setColor color                return R drawable app icon lolipop above              return R drawable app icon lolipop below

User · Answer

Requirements to fix this issue    Image Format  32-bit PNG  with alpha  Image should be Transparent Transparency Color Index  White  FFFFFF    Source  http   gr1350 blogspot com 2017 01 problem-with-setsmallicon html

User · Answer

Cause  For 5 0 Lollipop  quot Notification icons must be entirely white quot    If we solve the white icon problem by setting target SDK to 20   our app will not target Android Lollipop  which means that we cannot use Lollipop-specific features   Solution for target Sdk 21 If you want to support Lollipop Material Icons then make transparent icons for Lollipop and the above version  Please refer following  https   design google com icons  Please look at http   developer android com design style iconography html  and we ll see that the white style is how notifications are meant to be displayed in Android Lollipop  In Lollipop  Google also suggests that we use a color that will be displayed behind the white notification icon  Refer Link  https   developer android com about versions android-5 0-changes html Wherever we want to add Colors https   developer android com reference android support v4 app NotificationCompat Builder html setColor int  Implementation of Notification Builder for below and above Lollipop OS version would be  Notification notification   new NotificationCompat Builder this   if  android os Build VERSION SDK INT  gt   Build VERSION CODES LOLLIPOP        notification setSmallIcon R drawable icon transperent       notification setColor getResources   getColor R color notification color      else        notification setSmallIcon R drawable icon       Note  setColor is only available in Lollipop and it only affects to the background of the icon  It will solve your problem completely

User · Answer

Finally I ve got the solution for this issue   This issue occurs only when the app is not at all running   neither in  the background nor in the foreground   When the app runs on either foreground or background the notification icon is displayed properly  not the white square   So what we ve to set is the same configuration for notification icon in Backend APIs as that of Frontend   In the frontend we ve used React Native and for push notification we ve used react-native-fcm npm package   FCM on  notification   notif   gt       FCM presentLocalNotification          body  notif fcm body         title  notif fcm title         big text  notif fcm body         priority   high          large icon   notification icon      notification icon        icon   notification icon          show in foreground  true         color    8bc34b          vibrate  300         lights  true         status  notif status              We ve used fcm-push npm package using Node js as a backend for push notification and set the payload structure as follows       to    topics user      required   data        id 212      message   test message       title   test title         notification        title   test title       body   test message       icon    notification icon      same name as mentioned in the front end     color     8bc34b       click action    BROADCAST          What it basically searches for the notification icon image stored locally in our Android system

User · Answer

I found a link where we can generate our own white icon      try this link to generate white icon of your launcher icon    Open this Link and upload your ic launcher or notification icon

User · Answer

lt meta-data android name  com google firebase messaging default notification icon           android resource   drawable ic notification    gt    add this line in the manifest xml file in application block

User · Answer

If you wan to provide lollipop support notification icon then make two type notification icon     normal notification icon   for below lollipop version   notification icon with transparent background   for lollipop and above version    Now set appropriate icon to notification builder at run time base on OS version    NotificationCompat Builder mBuilder   new NotificationCompat Builder this   if  android os Build VERSION SDK INT  gt   Build VERSION CODES LOLLIPOP        mBuilder setSmallIcon R drawable ic push notification transperent     else       mBuilder setSmallIcon R drawable ic push notification

User · Answer

for  customized local notification   in AndroidManifest xml add following meta-data then it will work    lt application     android name  quot xxxxxx quot          android label  quot xxxxxx quot          android icon  quot  mipmap ic launcher quot                    gt           lt meta-data                 android name  quot your apps bundle id default notification icon quot                  android resource  quot  drawable ic notif quot    gt

User · Answer

Declare this code in Android Manifest     lt meta-data android name  com google firebase messaging default notification icon    android resource   drawable ic stat name    gt    I hope this useful to you

User · Answer

I have similar issue on android 8 0  Try to use WHITE icon resource  I have white square when i m trying to use colored image for icon  when i replace it to white icon  it s start work

User · Answer

If you are using Google Cloud Messaging  then this issue will not be solved by simply changing your icon  For example  this will not work    Notification notification    new Notification Builder this                   setContentTitle title                   setContentText text                   setSmallIcon R drawable ic notification                   setContentIntent pIntent                   setDefaults Notification DEFAULT SOUND Notification DEFAULT LIGHTS Notification DEFAULT VIBRATE                   setAutoCancel true                   build      Even if ic notification is transparant and white  It must be also defined in the Manifest meta data  like so      lt meta-data android name  com google firebase messaging default notification icon               android resource   drawable ic notification    gt    Meta-data goes under the application tag  for reference

User · Answer

I really suggest following Google s Design Guidelines  which says  quot Notification icons must be entirely white  quot

[android] Android Push Notifications: Icon not displaying in notification, white square shown instead

Examples related to android

Examples related to push-notification

Examples related to notifications

Examples related to firebase-cloud-messaging

Examples related to icons