Android Notifications with Images and Text Together

21 / Aug / 2014 by Anand Rai 0 comments

We all love notifications of android applications and its notification bar. But it would be much better if we can show the user the rich notifications instead of those boring text notifications. But it is not simple task that it sounds to be.

The problem is, when we try to display image with text then what we get only image or text depending on devices but not simultaneouly. If we get the text then to reveal the image we will have to expand the image by gesture and vice-versa otherwise.

Here, I will show you how to achieve this functionality. I discovered two solution for this problem.

Here is my fist solution that utilize Styles:

NotificationManager notificationManager = (NotificationManager)
          context.getSystemService(Context.NOTIFICATION_SERVICE);

Intent notificationIntent = new Intent(context, MainActivity.class);

notificationIntent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP
 | Intent.FLAG_ACTIVITY_SINGLE_TOP);

PendingIntent intent =
        PendingIntent.getActivity(context, 0,
         notificationIntent,PendingIntent.FLAG_UPDATE_CURRENT);

Bitmap bitmap = BitmapFactory.decodeResource(getResources(),
                                           R.drawable.large_icon);
String message="Hello Notification with image";
String title="Notification !!!";
int icon = R.drawable.ic_launcher;
long when = System.currentTimeMillis();

notification = new NotificationCompat.Builder(context)
 .setContentTitle(title)
 .setContentText(message)
 .setContentIntent(intent)
 .setSmallIcon(icon)
 .setWhen(when)
 .setStyle(new NotificationCompat.BigPictureStyle()
 .bigPicture(bitmap).setSummaryText(message))
 .build();

notification.flags |= Notification.FLAG_AUTO_CANCEL;

// Play default notification sound
 notification.defaults |= Notification.DEFAULT_SOUND;
 notification.defaults |= Notification.DEFAULT_VIBRATE;
 notificationManager.notify(0, notification);

In above code the I am calling Builder.setStyle() method passing new instance of NotificationCompat.BigPictureStyle() and providing it with a bitmap and message by calling its respective methods.

And here is another solution that utilzes Dynamic Layout:

 String title="Notification !!!";
 int icon = R.drawable.ic_launcher;
 long when = System.currentTimeMillis();

Notification notification = new Notification(icon, title, when);

 NotificationManager mNotificationManager =
      (NotificationManager)getSystemService(NOTIFICATION_SERVICE);

 RemoteViews contentView = new RemoteViews
                 (getPackageName(), R.layout.custom_notification);
 contentView.setImageViewResource(R.id.image,
                                  R.drawable.ic_launcher);
 contentView.setTextViewText(R.id.title, title);
 contentView.setTextViewText(R.id.text,
                               "This is a custom layout");
 notification.contentView = contentView;

 Intent notificationIntent = new Intent(this, MainActivity.class);
 PendingIntent contentIntent = PendingIntent.getActivity(this,0,
                                           notificationIntent, 0);
 notification.contentIntent = contentIntent;

 notification.flags |=
      Notification.FLAG_NO_CLEAR; //Do not clear  the notification
 notification.defaults |= Notification.DEFAULT_LIGHTS; // LED
 notification.defaults |= Notification.DEFAULT_VIBRATE;//Vibration
 notification.defaults |= Notification.DEFAULT_SOUND; // Sound

 mNotificationManager.notify(1, notification);

In this code I am using the RemoteViews class to set the image and text together. For getting this class to work we need to pass two argument, first is application package and other is layout file that describes an ImageView and two TextView.

And that is all we need to implement this feature correctly.

Have a nice time with your rich notifications. ;)

Tag -

FOUND THIS USEFUL? SHARE IT

Leave a comment -