{"_id":"5b720760c44b7600034b79e8","parentDoc":null,"githubsync":"","project":"55e67aaa9cc7c62b00c4a1ea","__v":9,"category":{"_id":"5b720760c44b7600034b79ac","project":"55e67aaa9cc7c62b00c4a1ea","__v":0,"version":"5b720760c44b7600034b7a08","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2017-02-08T21:31:11.878Z","from_sync":false,"order":6,"slug":"advanced-techniques","title":"Advanced Techniques"},"user":"56035f358d58900d0051e976","version":{"_id":"5b720760c44b7600034b7a08","project":"55e67aaa9cc7c62b00c4a1ea","__v":0,"forked_from":"5b1f2cbdfd653400031d8d9f","createdAt":"2015-09-02T04:27:23.612Z","releaseDate":"2015-09-02T04:27:23.612Z","categories":["5b720760c44b7600034b79a7","5b720760c44b7600034b79a8","5b720760c44b7600034b79a9","5b720760c44b7600034b79aa","5b720760c44b7600034b79ab","561c61b4ad272c0d00a892df","586c014c0abf1d0f000d04d4","58991d2ad207df0f0002186b","5b720760c44b7600034b79ac","5b720760c44b7600034b79ad","5af0fe494ca2730003cbc98a","5af0fe55ec80af0003804ca2"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"API V6","version_clean":"1.4.0","version":"1.4"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2016-05-19T02:48:53.845Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","apiSetting":null,"auth":"required","params":[],"url":""},"isReference":false,"order":11,"body":"Sailthru Mobile supports Android Rich Notifications out of the box for image payloads.\n\n\n### Send Rich Notifications\n\nWhen creating an in-app message with push notification, the image added to the in-app message will automatically be delivered to the Android device and displayed as a rich push notification.\n\nAlternatively, [rich notifications can be sent using the API as per the Rich Push example](https://docs.carnival.io/docs/notifications).\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/131d415-Screen_Shot_2018-05-08_at_1.45.22_PM.png\",\n        \"Screen Shot 2018-05-08 at 1.45.22 PM.png\",\n        1105,\n        523,\n        \"#e2e8ed\"\n      ],\n      \"caption\": \"Creating a message with an image inside the Carnival platform.\",\n      \"border\": true\n    }\n  ]\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/e9cb256-Screenshot_20170324-063420.png\",\n        \"Screenshot_20170324-063420.png\",\n        709,\n        508,\n        \"#e9dfdd\"\n      ],\n      \"caption\": \"An Android Rich Notification on device created from the message.\",\n      \"sizing\": \"smart\",\n      \"border\": true\n    }\n  ]\n}\n[/block]\n### Extend or change default behavior \n\nYou can extend or change this default behavior by adding a `NotificationCompat.Extender` and implementing your own notification style. This is useful if you want to add media controls, or you'd like to render the notification body with an expanded view.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"\\nimport android.support.v4.app.NotificationCompat;\\npublic class RichPushNotificationExtender implements NotificationCompat.Extender {\\n  protected static String TAG = \\\"RichPushNotificationExtender\\\";\\n  protected static String KEY_PAYLOAD_ALERT = \\\"alert\\\";\\n  protected static String KEY_PAYLOAD_TITLE = \\\"title\\\";\\n  protected static String KEY_PAYLOAD_IMAGE_URL = \\\"image_url\\\";\\n  protected static String KEY_PAYLOAD_ST = \\\"_st\\\";\\n  \\n  :::at:::Override\\n  public NotificationCompat.Builder extend(NotificationCompat.Builder builder) {\\n    Bundle bundle = builder.getExtras();\\n    Context context = builder.mContext;\\n    \\n    // For Image or Video in-app messages, we will send the media URL in the\\n    // _st payload\\n    String imageUrl = null;\\n    String stString = bundle.getString(KEY_PAYLOAD_ST);\\n    if(stString != null && !stString.isEmpty()) {\\n      try {\\n        JSONObject stPayload = new JSONObject(stString);\\n        if (!stPayload.isNull(KEY_PAYLOAD_IMAGE_URL)) {\\n          imageUrl = stPayload.getString(KEY_PAYLOAD_IMAGE_URL);\\n        }\\n      } catch (JSONException e) {\\n        Log.e(TAG, \\\"Unable to get \\\" + KEY_PAYLOAD_IMAGE_URL + \\\" from '_st' payload: \\\" + stString + \\\".\\\\n\\\" + e.getLocalizedMessage());\\n      }\\n    }\\n    \\n    builder.setContentTitle(context.getResources().getString(R.string.app_name))\\n      .setSmallIcon(R.drawable.carnival_bg_notification)\\n      .setContentText(bundle.getString(KEY_PAYLOAD_ALERT));\\n\\n    if(imageUrl != null && !imageUrl.isEmpty()) {\\n      Bitmap image = fetchImageForMessage(imageUrl);\\n\\n      NotificationCompat.BigPictureStyle largeFormatStyle = new NotificationCompat.BigPictureStyle()\\n        .bigPicture(image)\\n        .setBigContentTitle(context.getResources().getString(R.string.app_name))\\n        .setSummaryText(bundle.getString(KEY_PAYLOAD_TITLE))\\n        .bigLargeIcon(image);\\n      builder.setLargeIcon(image);\\n      builder.setStyle(largeFormatStyle);\\n    }\\n\\n    return builder;\\n  }\\n  \\n  // code used to load image from url\\n  private @Nullable Bitmap fetchImageForMessage(@NonNull String imageUrl) {\\n      URL url;\\n      try {\\n          url = new URL(imageUrl);\\n      } catch (MalformedURLException e) {\\n          Log.e(TAG, \\\"Malformed image URL in Push Payload: \\\" + e.getLocalizedMessage());\\n          return null;\\n      }\\n\\n      AsyncTask<URL, Void, Bitmap> task = new AsyncTask<URL, Void, Bitmap>() {\\n\\n          @Override\\n          protected Bitmap doInBackground(URL... params) {\\n              try {\\n                  URL url = params[0];\\n                  HttpURLConnection connection = (HttpURLConnection) url.openConnection();\\n                  connection.setDoInput(true);\\n                  connection.connect();\\n                  InputStream input = connection.getInputStream();\\n                  return BitmapFactory.decodeStream(input);\\n              } catch (IOException e) {\\n                  Log.e(TAG, \\\"IO Error loading Message image:\\\" + e.getLocalizedMessage());\\n                  return Bitmap.createBitmap(1, 1, Bitmap.Config.ALPHA_8);\\n              }\\n          }\\n\\n      }.execute(url);\\n      try {\\n          return task.get(5, TimeUnit.SECONDS);\\n      } catch (Exception e) {\\n          Log.e(TAG, \\\"Failed to wait for Message Image in RichPushNotificationExtender: \\\" + e.getMessage());\\n          return null;\\n      }\\n  }\\n   \\n}\",\n      \"language\": \"java\",\n      \"name\": \"Android (Java)\"\n    }\n  ]\n}\n[/block]\nThen add your extender to `NotificationConfig`\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"public class MyApplication extends Application {\\n  @Override\\n  public void onCreate() {\\n    super.onCreate();\\n\\n    Carnival.startEngine(getApplicationContext(), \\\"your sdk key\\\");\\n\\n    NotificationConfig notificationConfig = new NotificationConfig();\\n    notificationConfig.addNotificationExtender(new RichPushNotificationExtender());\\n    Carnival.setNotificationConfig(notificationConfig);\\n  }\\n}\",\n      \"language\": \"java\"\n    }\n  ]\n}\n[/block]","excerpt":"","slug":"rich-notifications","type":"basic","title":"Android: Rich Notifications"}

Getting started

Install in your app

Message Stream

Messaging your users

Before you submit your app

REST API

Advanced Techniques

Android: Rich Notifications

Sailthru Mobile supports Android Rich Notifications out of the box for image payloads. ### Send Rich Notifications When creating an in-app message with push notification, the image added to the in-app message will automatically be delivered to the Android device and displayed as a rich push notification. Alternatively, [rich notifications can be sent using the API as per the Rich Push example](https://docs.carnival.io/docs/notifications). [block:image] { "images": [ { "image": [ "https://files.readme.io/131d415-Screen_Shot_2018-05-08_at_1.45.22_PM.png", "Screen Shot 2018-05-08 at 1.45.22 PM.png", 1105, 523, "#e2e8ed" ], "caption": "Creating a message with an image inside the Carnival platform.", "border": true } ] } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/e9cb256-Screenshot_20170324-063420.png", "Screenshot_20170324-063420.png", 709, 508, "#e9dfdd" ], "caption": "An Android Rich Notification on device created from the message.", "sizing": "smart", "border": true } ] } [/block] ### Extend or change default behavior You can extend or change this default behavior by adding a `NotificationCompat.Extender` and implementing your own notification style. This is useful if you want to add media controls, or you'd like to render the notification body with an expanded view. [block:code] { "codes": [ { "code": "\nimport android.support.v4.app.NotificationCompat;\npublic class RichPushNotificationExtender implements NotificationCompat.Extender {\n protected static String TAG = \"RichPushNotificationExtender\";\n protected static String KEY_PAYLOAD_ALERT = \"alert\";\n protected static String KEY_PAYLOAD_TITLE = \"title\";\n protected static String KEY_PAYLOAD_IMAGE_URL = \"image_url\";\n protected static String KEY_PAYLOAD_ST = \"_st\";\n \n @Override\n public NotificationCompat.Builder extend(NotificationCompat.Builder builder) {\n Bundle bundle = builder.getExtras();\n Context context = builder.mContext;\n \n // For Image or Video in-app messages, we will send the media URL in the\n // _st payload\n String imageUrl = null;\n String stString = bundle.getString(KEY_PAYLOAD_ST);\n if(stString != null && !stString.isEmpty()) {\n try {\n JSONObject stPayload = new JSONObject(stString);\n if (!stPayload.isNull(KEY_PAYLOAD_IMAGE_URL)) {\n imageUrl = stPayload.getString(KEY_PAYLOAD_IMAGE_URL);\n }\n } catch (JSONException e) {\n Log.e(TAG, \"Unable to get \" + KEY_PAYLOAD_IMAGE_URL + \" from '_st' payload: \" + stString + \".\\n\" + e.getLocalizedMessage());\n }\n }\n \n builder.setContentTitle(context.getResources().getString(R.string.app_name))\n .setSmallIcon(R.drawable.carnival_bg_notification)\n .setContentText(bundle.getString(KEY_PAYLOAD_ALERT));\n\n if(imageUrl != null && !imageUrl.isEmpty()) {\n Bitmap image = fetchImageForMessage(imageUrl);\n\n NotificationCompat.BigPictureStyle largeFormatStyle = new NotificationCompat.BigPictureStyle()\n .bigPicture(image)\n .setBigContentTitle(context.getResources().getString(R.string.app_name))\n .setSummaryText(bundle.getString(KEY_PAYLOAD_TITLE))\n .bigLargeIcon(image);\n builder.setLargeIcon(image);\n builder.setStyle(largeFormatStyle);\n }\n\n return builder;\n }\n \n // code used to load image from url\n private @Nullable Bitmap fetchImageForMessage(@NonNull String imageUrl) {\n URL url;\n try {\n url = new URL(imageUrl);\n } catch (MalformedURLException e) {\n Log.e(TAG, \"Malformed image URL in Push Payload: \" + e.getLocalizedMessage());\n return null;\n }\n\n AsyncTask<URL, Void, Bitmap> task = new AsyncTask<URL, Void, Bitmap>() {\n\n @Override\n protected Bitmap doInBackground(URL... params) {\n try {\n URL url = params[0];\n HttpURLConnection connection = (HttpURLConnection) url.openConnection();\n connection.setDoInput(true);\n connection.connect();\n InputStream input = connection.getInputStream();\n return BitmapFactory.decodeStream(input);\n } catch (IOException e) {\n Log.e(TAG, \"IO Error loading Message image:\" + e.getLocalizedMessage());\n return Bitmap.createBitmap(1, 1, Bitmap.Config.ALPHA_8);\n }\n }\n\n }.execute(url);\n try {\n return task.get(5, TimeUnit.SECONDS);\n } catch (Exception e) {\n Log.e(TAG, \"Failed to wait for Message Image in RichPushNotificationExtender: \" + e.getMessage());\n return null;\n }\n }\n \n}", "language": "java", "name": "Android (Java)" } ] } [/block] Then add your extender to `NotificationConfig` [block:code] { "codes": [ { "code": "public class MyApplication extends Application {\n @Override\n public void onCreate() {\n super.onCreate();\n\n Carnival.startEngine(getApplicationContext(), \"your sdk key\");\n\n NotificationConfig notificationConfig = new NotificationConfig();\n notificationConfig.addNotificationExtender(new RichPushNotificationExtender());\n Carnival.setNotificationConfig(notificationConfig);\n }\n}", "language": "java" } ] } [/block]