CONTACT ME

  • Black Twitter Icon
  • Black Facebook Icon
  • Black LinkedIn Icon

Want to record an episode with me? Want to invite me to speak at your conference? let me know!

  • Britt Barak

Notifications — Part 3 : Going Custom

Notifications are a very important and powerful tool. Use them correctly — you can significantly increase user engagement. Use them poorly- you might even risk it with users uninstalling your app…


As the Android N release has some new notification features in store, and a new elegant facelift, it is a perfect opportunity to review all that Android allows us to do with notifications, and improve the user experience and engagement.


Last times we showed how to use styling options, then added a progress indicator to our notifications.


But what if we want a whole other custom view?


Custom views

For this case we use RemoteViews, which is:

A class that describes a view hierarchy that can be displayed in another process.

The RemoteViews take your regular layout resource file, and provide basic operations for modifying the content of views in it.


This is an example for creating and setting the RemoveView used for the screenshots below:


RemoteViews remoteViews = new RemoteViews(context.getPackageName(), layoutResId);
remoteViews.setImageViewResource(R.id.image_icon, iconResource);
remoteViews.setTextViewText(R.id.text_message, message);


What does it look like?


Before Nougat

the notification layout is entirely the RemoteView layout. For example:


by using

builder.setContent(remoteViews)

and :

builder.setCustomBigContentView(bigRemoteViews)


On Nougat

setContent() and setCustomBigContentView() are deprecated!


We have setCustomContentView(), and setCustomBigContentView() instead.


In addition, new Styles introduce better support for the custom content view. They wrap the custom layouts, for a better, more coherent look and feel. This allows to easily use the header, large icon, expander, actions… and other features and attributes notifications commonly have.



DecoratedCustomViewStyle

builder.setStyle(new Notification.DecoratedCustomViewStyle())
       .setCustomContentView(remoteViews)
       .setCustomBigContentView(bigRemoteView);

Another Style you might use:


DecoratedMediaCustomViewStyle

which has features of the MediaStyle mentioned on 1st post on this series, like setShowActionsInCompactView().

builder.setStyle(new Notification.DecoratedMediaCustomViewStyle()
       .setCustomContentView(remoteViews)
       .setCustomBigContentView(bigRemoteViews)
       .setShowActionsInCompactView(1, 3));



A word about sizing

It is always important to ensure our layouts fit different screen resolutions , orientations etc..


In this case be even more prudent, as space is very limited.


To be exact, height available is:

  • 64 dp for a normal (or “collapsed”) view.

  • 256 dp for an expanded view.


A word about visibility

Notifications background color varies across different devices and versions, so make sure the custom content is visible. If not setting a background color, use style resources (such as style/NotificationContent).


Well,

We saw how to further customize the content layout of a notification, and make them our own.


Next posts will make our notifications more useful by adding some actions. Don’t go far :)