Skip to end of metadata
Go to start of metadata

Today, most Android applications are integrated with the option to send push notifications. Developers and app publishers consider this capability as one of the most important actions in maintaining the relationship with their users and the ability to motivate them into performing certain actions within the app. However, in most applications the display of push notification message is quite basic - a miniature version of the app icon, a title (most of the time it will be the app name), with a short description below it.



 

Push notification message can be much more interesting! One of the better examples for it, is the way in which Groupon send their push messages - big and seductive picture, with important details such as price and the amount of discount. They also display action buttons!



 In this tutorial we will learn how to create a rich push notification message.

Integrating Push Notifications in your app

 If your app doesn’t yet support in basic push notification, please refer to PushApps short tutorial:
 

https://wiki.pushapps.mobi/display/PUSHAPPS/Android+Getting+Started

This tutorial assumes you have completed the basic push notifications integration, and you are able to receive notifications to your device. We will take you step by step from this phase and show you how to code and design the notification.

Push Notification received event

After you register the device to PushApps with your private keys, we would like to “take control” over the push notification received event. We would like to perform certain actions and display our custom view. With PushApps it’s easy:


1. In you Application class (if you don’t have one, please create it) register to PushApps with your Google API Project Number and PushApps Token.

register to PushApps with your Google API Project Number and PushApps Token

2. We want PushApps to notify us when a new push notification received to the device. For that, we need to implement the PushAppsMessageInterface.

 

implement the PushAppsMessageInterface

Creating the custom view

 

The first step in building your own unique View, is writing the XML. There is nothing new in this section - exactly as we build a new view for an Activity or a Fragment, same is here. Like all other XMLs, this one will also should be placed inside the res / layout directory. In this tutorial, we’re creating a similar view as the one as Groupon. However, you can create any view you want, while the only limit is the view height - remember that this is not a full-screen view (but only shown in the Notification Center).

 

1. Creating the XML:

 

Creating the custom view - Creating the XML


2. We would like to link our new XML with our code, and of course update the view values (such as text and image) with those we received in the push notification JSON:

 

Creating the custom view - link our new XML with our code

 

Sending a Push Notification from the PushApps Admin Console

 

Sending a push notification from the PushApps Admin Console is very simple. You can learn a lot about it from our WIKI -
http://wiki.pushapps.mobi/display/PUSHAPPS/Admin+Console.

Please notice that the parameters keys that you provide in the Admin Console should match those in your Android code

 

Finally!

 

Some minor side notes:

  • Notice that this code is compatible for Android devices running API 11 version or higher. There are similar solutions for custom push notifications view for older devices - just google it.
  • If you Notification Center in your device is full with other push notifications from other apps, the push notification view will appear in its small and regular view (without the custom view). That’s why it’s important to provide the parameters for the regular state (e.g. Small Icon, Content Title, Content Text).

Checkout the entire source code from here.

Happy Coding!


 



 

 

  • No labels