When creating notifications for a recent project at work we had some initial confusion about how these notifications are actually supposed to work.

Icons

The first thing that came as a surprise to us is that the icon you set to the notification has to be a specific size. According to the documentation:

Notification icons must be 24x24 dp.

In case you didn’t know, that’s really tiny. But if you take a look this is actually how most apps are doing it. If you were to look at your android phone right now, however, you’d probably notice that most of the apps that left you notifications are all chat or email services which prefer to use the large contact images chosen by your friends who are contacting you – a friend’s portrait for example. This is achieved via setLargeIcon(), which expects a Bitmap. From my experience, however, you can’t have a large icon without having a small icon, which is assigned via setSmallIcon() and expects an int id to a drawable.

Changing colors

Now, once you create your tiny, white, 24x24dp icon as suggested in Google’s Iconography: Notifications, you might notice it’s quite bland looking, and depending on your Android OS version, you might have some funky looking background. Mine was showing in a light gray circle on 4.4.

default notification color

White on light gray is not very aesthetic. Don’t worry, just like the gmail app, we are able to change the color of that circle (or square, depending on your version of Android). Just make a call to the setColor() method. This method is expecting an int for its rgba value. If you don’t know how to do that offhand, don’t worry. You can use the context.getResources.getColor() method to handle this for you. In order to do that, you need a reference to a Context object.
custom colored notification

Sample Code

Notification notification = new NotificationCompat.Builder(context)
    .setSmallIcon(R.mipmap.ic_launcher)
    .setContentText("Simple description of something meaningful")
    .setContentTitle("Yo check this out")
    .setColor(context.getResources()
            .getColor(R.color.brand_color))
    .build();

NotificationManager manager 
    = (NotificationManager)getSystemService(Context.NOTIFICATION_SERVICE);

manager.notify(SINGLE_NOTIFICATION_ID, notification);

In this sample brand_color is defined as #FF0066CC.

Side notes

In my example, the icon isn’t white, that’s because I’m too lazy to create my own icon for the purpose of this example, so I used the default launcher icon. Generally speaking, however, according to the guidelines you should use a flat white silhouette style icon.

Happy hacking!