What is a notification badge you ask? Also known as ‘Dots’, these allow us to display a Badge (or Dot) on our applications launcher icon to notify our users that there is a pending notification that they have not yet acted upon.
These badges will automatically appear when a notification is received and disappear when there are no notifications that remain to be interacted with.
When the notification badge is showing, the user can perform a long press on the application icon to reveal a pop-up dialog that displays the notifications that currently exist for that app.
Personally for me this feels like a much better interaction point for notifications, meaning that I no longer have to reach all the way to the top of my screen to interact with notifications. It also allows me to see only the notifications I want to for a specific app, rather than being overwhelmed by notifications in the status bar.
Within this pop-up the user can interact with the notification (such as click on it) or swipe it away to dismiss it from the list of notifications. When the last notification is dismissed the notification dot will disappear from the notification icon.
You may have also noticed the number that is shown on the right-hand-side of the Notifications header section of the notification pop-up. Each new notification that is received in a any channel for the app in question will increment this number, as these notifications are dismissed the notification count will be decremented. This number can be manually overridden programatically — we’ll look at how we can do this in a bit 🙂
Notification badges might not be for everyone though! if this is the case then the user can tap on the ‘App Info’ button displayed in the notification badge pop-up, this will take them to the App Info screen for the given application.
At this point, the user has the ability to select ‘App notifications’ and from here toggle whether or not the notification badge should be shown for the given application.
When notification badges are disabled, notifications will still be shown in the status bar — the only difference is that no badge will be shown on the application icon.
When using notification badges, it’s important to remember that you don’t need to badge every type of notification from your app. For example, an ongoing process (such as listening to a song in Spotify) wouldn’t make sense to show as a notification badge, or any other kind of event that is something currently taking place (such as alarms or calendar events.
However, events such as messages in Slack, or a new email in Gmail, or when a post fails to go out in Facebook would make sense to show as a notification badge.
But how can we toggle what notifications are to be shown as badges and which ones aren’t? Well, that’s where we make sue of notification channels by grouping related notifications into fine-grained categories so that we can manage the badges for those channels individually.
Note: We’re not going to cover much to do with Notification Channels as I already covered it in this article if you wish to learn more:
The default behaviour for notification channels and badges is that their notifications will be shown in the pop-up dialog and reflected by the badge shown on the app icon. If you don’t want to show the notification badge for the notification channel then you can use the setShowBadge() method to disable the display of the badge for the given channel.
Note: This behaviour change must be set before the channel has been created and submitted to the notification manager, changes will not be displayed if set after this point in time.
The Notification Builder used to build notifications now comes with a method called setNumber(). This method can be used to customise the number shown for the notification count when the user long presses on the application icon with the notification badge
You can use this notification count to display a custom value for the count of notifications. So for example, on the screenshot here you can only see a single notification but the count shows at 8. In this context, 8 could be the number of discounts available to the user (but I don’t want to show 8 notifications for that!). It would even work for things such as messaging applications, where you may want to display the number of messages received along with a notification to display that someone has messaged you.
If you don’t make use of this setNumber() method, then the notification count will be automatically incremented / decremented as notifications are received and removed.
By default the menu shown from a long press uses the Large notification icon. However, we can make use of the setBadgeIconType() method to set this to use a small icon (using BADGE_SMALL_ICON) instead if we wish 🙂
That’s all pretty neat isn’t it! Hopefully from this you can see just how easy it is to implement notification badges into your app. I’m looking forward to both adding these to any applications I work on, as well as using them in applications so that I can take a more fine grained approach to managing notifications for those applications.
Any questions or tips building on what we’ve looked at, I’d love to hear from you!
P.s Check out some of my other projects over at: