Implementations of Emoji (Emoticon) View/Keyboard Layouts

toobsco42 picture toobsco42 · May 27, 2013 · Viewed 92.7k times · Source

I am trying to figure out how the emoji (emoticon) selections are implemented on the Facebook app and the Google Hangouts app. I looked into the SoftKeyboard Demo app in the Android API Samples but the display of these emoji views does not look like a SoftKeyboard. It looks and behaves more like a custom Dialog view. Does anyone have an idea of how these are implemented?

Facebook App

Facebook

Google Hangouts app

Hangouts

Also, is Unicode the best way to send emoticons or is there an alternative? I noticed that some Unicode sequences like \u1F601 don't render the corresponding emoticon and instead that sequence just shows up as 1 :

EditText messageInput = (EditText) findViewById(R.id.message_input);
messageInput.getText().append("\u1F601");

Answer

toobsco42 picture toobsco42 · Jun 10, 2013

I found a very useful Emoticon Keyboard. This keyboard is not using Unicode sequences but rather just local image assets. I am thinking that this type of keyboard can only be useful within this app and not with other apps or Operating Systems.

So instead I am replacing the ImageView containing an asset with a TextView containing a Unicode sequence.

After cross referencing Supported Unicode Sequences as well as the Visual Unicode Database I realized that \u1F601 was a 32 bit Unicode representation, and the 16bit representation can be set like :

EditText messageInput = (EditText) findViewById(R.id.message_input);
messageInput.getText().append("\ud83d\ude01");