{"id":15247,"date":"2014-08-21T15:35:52","date_gmt":"2014-08-21T10:05:52","guid":{"rendered":"http:\/\/www.tothenew.com\/blog\/?p=15247"},"modified":"2016-08-30T11:00:24","modified_gmt":"2016-08-30T05:30:24","slug":"android-notifications-with-images-and-text-together","status":"publish","type":"post","link":"https:\/\/www.tothenew.com\/blog\/android-notifications-with-images-and-text-together\/","title":{"rendered":"Android Notifications with Images and Text Together"},"content":{"rendered":"

We all love notifications of android applications<\/a> 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.<\/p>\n

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.<\/p>\n

Here, I will show you how to achieve this functionality. I discovered two\u00a0solution for this problem.<\/p>\n

Here is my fist solution that utilize Styles:<\/p>\n

[sourcecode language=”java”]
\nNotificationManager notificationManager = (NotificationManager)
\n context.getSystemService(Context.NOTIFICATION_SERVICE);<\/p>\n

Intent notificationIntent = new Intent(context, MainActivity.class);<\/p>\n

notificationIntent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP
\n | Intent.FLAG_ACTIVITY_SINGLE_TOP);<\/p>\n

PendingIntent intent =
\n PendingIntent.getActivity(context, 0,
\n notificationIntent,PendingIntent.FLAG_UPDATE_CURRENT);<\/p>\n

Bitmap bitmap = BitmapFactory.decodeResource(getResources(),
\n R.drawable.large_icon);
\nString message="Hello Notification with image";
\nString title="Notification !!!";
\nint icon = R.drawable.ic_launcher;
\nlong when = System.currentTimeMillis();<\/p>\n

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

notification.flags |= Notification.FLAG_AUTO_CANCEL;<\/p>\n

\/\/ Play default notification sound
\n notification.defaults |= Notification.DEFAULT_SOUND;
\n notification.defaults |= Notification.DEFAULT_VIBRATE;
\n notificationManager.notify(0, notification);
\n[\/sourcecode]<\/p>\n

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.<\/p>\n

And here is another solution that utilzes Dynamic Layout:<\/p>\n

[sourcecode language=”java”]
\n String title="Notification !!!";
\n int icon = R.drawable.ic_launcher;
\n long when = System.currentTimeMillis();<\/p>\n

Notification notification = new Notification(icon, title, when);<\/p>\n

NotificationManager mNotificationManager =
\n (NotificationManager)getSystemService(NOTIFICATION_SERVICE);<\/p>\n

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

Intent notificationIntent = new Intent(this, MainActivity.class);
\n PendingIntent contentIntent = PendingIntent.getActivity(this,0,
\n notificationIntent, 0);
\n notification.contentIntent = contentIntent;<\/p>\n

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

mNotificationManager.notify(1, notification);
\n[\/sourcecode]<\/p>\n

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.<\/p>\n

And that is all we need to implement this feature correctly.<\/p>\n

Have a nice time with your rich notifications. \ud83d\ude09<\/p>\n","protected":false},"excerpt":{"rendered":"

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 […]<\/p>\n","protected":false},"author":131,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"iawp_total_views":15},"categories":[518],"tags":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/15247"}],"collection":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/users\/131"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/comments?post=15247"}],"version-history":[{"count":0,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/15247\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/media?parent=15247"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/categories?post=15247"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/tags?post=15247"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}