I tried making the small icon exactly 16x16, gray-scaled, nothing but gray and white (the gray color being hex value 616161), to create a silhouette of my application icon.
Yet no matter what it just shows up as a white/gray square in the notifications. What am I doing wrong?
(My min api is 21, assuming it is relevant)
Follow this link
First let’s understand the Android documentation which is as follows
“Update or remove assets that involve color. The system ignores all
non-alpha channels in action icons and in the main notification icon.
You should assume that these icons will be alpha-only. The system
draws notification icons in white and action icons in dark gray.”
Now this is easy to miss and I have seen many apps that are live in the app store with thousands of users who haven’t followed the mentioned guidelines.
So let me explain in detail how you can convert your notification icon to an Android friendly one with a few clicks.
In your favourite image editor open up your icon file. Convert all parts of the image that you don’t want to show to transparent pixels. All colors and non transparent pixels are displayed in white. Let us go through an example.
EDITED: Thanks #Andrey Patseiko for the tool
For notification you have to use different icons for different versions of android:
Notification notification = new Notification.Builder(context)
.setAutoCancel(true)
.setContentTitle("My notification")
.setContentText("Look, white in Lollipop, else color!")
.setSmallIcon(getNotificationIcon())
.build();
return notification;
Get notification icon on the basis of version
private int getNotificationIcon() {
boolean useWhiteIcon = (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP);
return useWhiteIcon ? R.drawable.icon_silhouette : R.drawable.ic_launcher;
}
Along with new features and capabilities, Android 5.0 includes a variety of system changes and API behavior changes. See the notification behavior changes.
Notifications are drawn with dark text atop white (or very light)
backgrounds to match the new material design widgets. Make sure that
all your notifications look right with the new color scheme. If your
notifications look wrong, fix them:
Use setColor() to set an accent color in a circle behind your icon image.
Update or remove assets that involve color. The system ignores all non-alpha channels in action icons and in the main notification icon.
You should assume that these icons will be alpha-only. The system
draws notification icons in white and action icons in dark gray.
So, basically you have to use silhouette icons as notification icon for API Level 21+
Related
I am working on Android app (API level >23). And I have to
support Notification.
And my notification icon is supported more than two colors.
If I use that icon then icon displays in grey in notification
pannel.
So I have created background transparent and completly white icon
and set color dynamically.
But I am able to set only one color (setColor()).
So my question is :-
How to support multiple colors (more than two color or color gradients) for Android Notification icon?
Note :- I have taken reference of Android Push Notifications: Icon not displaying in notification, white square shown instead
Thanks for support in advance.
If your app targets SDK 21+ the system will always tint your notification icon
white when it's displayed in a dark status bar
dark grey when it's displayed on a light status bar (API 23+)
dark grey when it's collapsed at the bottom of the notification shade
the color you set when it's part of a notification in the notification shade (API 24+, before that you'd have a white icon over a colored circle as the default large notification icon)
You have no control over the color other than what's described above.
But you can work with alpha channel. You can achieve different degrees of white/dark grey/color in your icon.
No, there's no other way. Pass this on to your designer and management.
Android 5.0 Behavior Changes
Notifications
Material design style
Update or remove assets that involve color. The system ignores all non-alpha channels in action icons and in the main notification icon. You should assume that these icons will be alpha-only. The system draws notification icons in white and action icons in dark gray.
Source: https://developer.android.com/about/versions/android-5.0-changes.html#NotificationsMaterialDesignStyle
Notifications
Make sure your notifications take these Android 5.0 changes into account. To learn more about designing your notifications for Android 5.0 and higher, see the notifications design guide.
Material design style
Notifications are drawn with dark text atop white (or very light) backgrounds to match the new material design widgets. Make sure that all your notifications look right with the new color scheme. If your notifications look wrong, fix them:
Use setColor() to set an accent color in a circle behind your icon image.
Update or remove assets that involve color. The system ignores all non-alpha channels in action icons and in the main notification icon. You should assume that these icons will be alpha-only. The system draws notification icons in white and action icons in dark gray.
from:
https://developer.android.com/about/versions/android-5.0-changes.html#NotificationsMaterialDesignStyle
I set up a ongoing notification with a foreground service. Here is the code.
NotificationCompat.Builder notificationBuilder= new NotificationCompat.Builder(this,"unique")
.setSmallIcon(R.drawable.ic_mms_black_24dp)
.setContentTitle("My notification")
.setContentText("Hello World!")
.setPriority(NotificationCompat.PRIORITY_DEFAULT);
Notification notification= notificationBuilder.build();
startForeground(MY_ID,notification);
But the icon that I have set at setSmallIcon() have no effect, instead it shows default app icon on status bar and notification panel which run on the Android 6. However After that I ran the above code on Android 5.1.1 (API LEVEL 22) and it shows the correct icon. I tried different types of icon (png,xml) and all worked well. But on my Marshmallow one It just shows the default app icon.
How do I figure out the reason?
From Android 6(Icon is at the left most corner):
From Android 5(Icon is at the left most corner):
EDIT: I tried a white icon too. But still notification shows the default app icon. Is there any size constraints of the icon? But xml icons are scalable right.
It seems like issue is from manufacture of the OS. There is a issue in EMUI 4.0+ that doesn't show custom notification icons. It only shows the application default icon in the status bar. If your model has EMUI It is the issue. This guide might help to fix the issue - How to enable ui tuner EMUI 4 .
It is most likely because your icon is black in color.
For latest Android versions, you need the notification icon to be white in color.
Status bar icons are composed simply of white pixels on a transparent
backdrop
You could checkout the guidelines here -
https://developer.android.com/guide/practices/ui_guidelines/icon_design_status_bar
Also make sure that you have all the correct sizes required by different screen densities as well.
The user send me the screenshot of my app about the notification icons are greyscaled. I have a colourful icons. Why?
I'm using this code to show notifications:
target api - 23.
NotificationCompat.Builder builder = new NotificationCompat.Builder(ctx);
Notification notification = builder.setContentIntent(pIntent)
.setSmallIcon(icon).setTicker(title).setWhen(when).setContentTitle(contentTitle)
.setContentText(contentText).setDefaults(defaults).build();
notification.flags = flags;
I guess you already aware about Notification icon design guidelines for lollipop and upper versions of android.
Make sure your notifications take these Android 5.0 changes into
account. To learn more about designing your notifications for Android
5.0 and higher, see the notifications design guide.
Material design style
Notifications are drawn with dark text atop white (or very light)
backgrounds to match the new material design widgets. Make sure that
all your notifications look right with the new color scheme. If your
notifications look wrong, fix them:
Use setColor() to set an accent color in a circle behind your icon
image. Update or remove assets that involve color. The system ignores
all non-alpha channels in action icons and in the main notification
icon. You should assume that these icons will be alpha-only. The
system draws notification icons in white and action icons in dark
gray.
Every time I run my application, the notification symbol in the notification bar is just a white square. My notification worked fine on all other android versions except for lollipop. I have looked at other threads and they don't seem to work. Anyone have any suggestions?
I have attached a picture of the notification icon I want to use:
http://i.stack.imgur.com/XhJcA.gif
It is a 48x48 gif. file with a transparent background. I have also tried a 16x16 gif file and I still had no luck.
Lollipop changes the notification styling according to this Behavior Changes. It changes the background of the notification circle to be white so white on white will not work, but you can change that to any color you want by
int color = getResources().getColor(R.color.my_notif_color);
NotificationCompat.Builder builder = new NotificationCompat.Builder(this);
builder.setColor(color);
....
As hegazy has explained the new notification styling causes that.
Notice that if you are not using any new functionality, as a workaround you can stay with previous styling by setting the target SDK to 20 max: android:targetSdkVersion="20"
I have this code:
Notification notif;
// Build notification
Notification.Builder notifBuilder = new Notification.Builder(context);
notifBuilder.setContentIntent(pendingIntent);
notifBuilder.setContentTitle(title);
notifBuilder.setSmallIcon(icon_resId);
notifBuilder.setContentText(ne.getCaption());
notifBuilder.setDefaults(Notification.DEFAULT_ALL);
notifBuilder.setAutoCancel(autocancel);
notifBuilder.setWhen(System.currentTimeMillis());
notif = notifBuilder.build();
and works fine in Android 4.4.
However, in Android 5.0 the icon showed in status bar is a white square. The icon showed in the new "notification body", that appears when device is locked, is correct.
In http://developer.android.com/reference/android/app/Notification.Builder.html, I don't see anything new about notification icons in API Level 21
Look at the documentation:
http://developer.android.com/design/style/iconography.html
there are words: "Notification icons must be entirely white. Also, the system may scale down and/or darken the icons."
I have resolved changing the icon size to 16x16 px and using only white color
As noted in Android 5.0 Behavior Changes of the Android Developers site under Notifications:
Notifications are drawn with dark text atop white (or very light) backgrounds to match the new material design widgets. Make sure that all your notifications look right with the new color scheme. If your notifications look wrong, fix them:
Use setColor() to set an accent color in a circle behind your icon image.
Update or remove assets that involve color. The system ignores all non-alpha channels in action icons and in the main notification icon. You should assume that these icons will be alpha-only. The system draws notification icons in white and action icons in dark gray.
http://developer.android.com/about/versions/android-5.0-changes.html.
Duplicate : Notification bar icon turns white in Android 5 Lollipop
In a Brief :
Android 5 update :
https://developer.android.com/about/versions/android-5.0-changes.html
Notifications -> Material design style
Update or remove assets that involve color. The system ignores all
non-alpha channels in action icons and in the main notification icon.
You should assume that these icons will be alpha-only. The system
draws notification icons in white and action icons in dark gray.
It's possible to set the small icon background color using (default is gray) :
Notification.Builder#setColor(int)
Add this in your manifest -
<meta-data android:name="com.google.firebase.messaging.default_notification_icon"
android:resource="#drawable/ic_notification" />
Anyone still looking at this, the simplest way of getting your icon to display correctly is first rendering it with the Android Icon Studio here:
https://romannurik.github.io/AndroidAssetStudio/icons-notification.html
Unzip the files from the downloaded zip into your project /main folder, so they slot into the relevant drawable-xxxx folders.
Then, to change colour in the notification use something like this:
NotificationCompat.Builder builder = new NotificationCompat.Builder(context, CHANNEL_ID)
.setSmallIcon(R.drawable.ic_notification_appicon) // <-- Icon from Android Icon Studio
.setColor(context.getColor(R.color.holo_blue)) // <-- Set your preferred icon colour to appear in the notification dropdown list
.setContentTitle("Title")
.setContentText("Content")
.setAutoCancel(true)
.setCategory(NotificationCompat.CATEGORY_EVENT)
.setDefaults(Notification.DEFAULT_ALL)
.setPriority(NotificationCompat.PRIORITY_DEFAULT);
In Android 5.0 the icon showed in the status bar is a white square because of 5.0 Lollipop "Notification icons must be entirely white".
You can easily find this types of icons on the Material icon.
Visit: https://material.io/icons/
Google also suggests that we use a custom color that will be displayed behind the white notification icon using setColor() method.
For more information visit: https://developer.android.com/about/versions/android-5.0-changes.html
Remove the android:targetSdkVersion="21" from manifest.xml.
it will work!