Displaying emojis in notification's content

Question

What is the best practice for sending notifications with emoji, how should the payload look like?

Is there any parsing required to be done in the app to display emojis properly, or it just works out of the box if emojis are formatted properly?

I tried to send this emoji and tried various formats: http://www.charbase.com/1f602-unicode-face-with-tears-of-joy

the payload looked something like this:

 "payload": {
  "message": "U+1F602 \ud83d\ude02 😂 😂 f0 9f 98 82",
  "title": "Hello",
  "id": 123,
}

This is how app displays the notification:

@Override
    protected void onHandleIntent(Intent intent) {
        Bundle extras = intent.getExtras();
                GCMPayload payload = new GCMPayload(
                        extras.getString("title"),
                        extras.getString("message"),
                        Strings.convertToLong(extras.getString("id")),
                );

                sendNotification(this, payload);
            }
        }

And within sendNotification method, the notification content text is set like this:

 NotificationCompat.Builder builder =
                new NotificationCompat.Builder(context)
                        .setDefaults(Notification.DEFAULT_SOUND | Notification.DEFAULT_VIBRATE)
                        .setContentTitle(payload.getTitle())
                        .setContentText(payload.getMessage())
                        .setStyle(new NotificationCompat.BigTextStyle().bigText(payload.getMessage()));

The emojis don't get displayed, their codes get displayed instead. Which encoding should be used? What else needs to be done in order to display emojis correctly?

Solution 1

First try hardcoding this in your Android client onMessageReceived method:

String title = "Title \uD83D\uDE00";
...
.setContentTitle(title)
...

This will show Title 😀 in the notification title.

If everything worked ok, try debugging and watching the title variable. You will see something like this in your debugger:

0 = 'T' 84
1 = 'i' 105
2 = 't' 116
3 = 'l' 108
4 = 'e' 101
5 = ' ' 32
6 = '\uD83D' 55357
7 = '\uDE00' 56832

Now, remove the hardcoded title in the Android client and try sending the same text from your server. Verify in the client if you are receiving the exact same characters, if not, then the problem is the server encoding.

Using the following folder from Google you can get a server running:

Sender sender = new Sender("YOUR API KEY");
Message.Builder builder = new Message.Builder();
builder.addData("title", "Title \uD83D\uDE00");
sender.send(builder.build(), "YOUR DEVICE TOKEN", 5);

Note: For more emojis, you can try this site, where you can type the text, click an emoji and then copy the whole text and paste it on your server.

Solution 2

Add the resource like follows:

<string name="string_title">This is a emoji example <U+1F642></string>

In Android Studio 3.0 you can copy and paste an emoji:

And here how it looks: