EmojiCompat Examples - Kotlin Android

Understanding EmojiCompat in Android.

In recent years, emojis have become an integral part of our daily communication. Emojis have revolutionized the way we express our emotions, thoughts, and feelings through digital channels. However, not all devices and platforms support the latest emojis, leading to inconsistencies in the representation of emojis across different devices and platforms.

To address this issue, Google introduced EmojiCompat in Android, which is a support library that allows developers to use the latest emojis on their apps, regardless of the Android version running on the device. In this article, we will explore EmojiCompat in a step-by-step manner.

Step 1: Add the EmojiCompat support library to your project

The first step is to add the EmojiCompat support library to your project. You can do this by adding the following code to your app's build.gradle file:

dependencies {
    implementation "com.android.support:support-emoji:28.0.0"
}

Step 2: Create an instance of EmojiCompat

Next, you need to create an instance of EmojiCompat. You can do this using the following code:

val config: EmojiCompat.Config = EmojiCompat.Config.Builder()
        .setReplaceAll(true)
        .build()

val emojiCompat: EmojiCompat = EmojiCompat.init(config)

The setReplaceAll method specifies whether to replace all emojis or only the unsupported ones. In this example, we are replacing all emojis.

Step 3: Load the emoji font

After creating an instance of EmojiCompat, you need to load the emoji font. You can do this using the following code:

emojiCompat.registerInitCallback(object : EmojiCompat.InitCallback() {
    override fun onInitialized() {
        // Callback when EmojiCompat is ready to go
    }

    override fun onFailed(throwable: Throwable?) {
        // Callback when there is an error initializing EmojiCompat
    }
})

emojiCompat.registerFontProvider(FontRequestEmojiCompatConfig(this, FontRequest(
        "com.google.android.gms.fonts",
        "com.google.android.gms",
        "Noto Color Emoji Compat",
        R.array.com_google_android_gms_fonts_certs)))
emojiCompat.flush()

The registerInitCallback method registers a callback that is called when EmojiCompat is initialized. The registerFontProvider method loads the emoji font from Google's servers. The flush method is used to flush the EmojiCompat cache.

Step 4: Use the latest emojis in your app

Once you have loaded the emoji font, you can use the latest emojis in your app. You can do this using the following code:

val emojiTextView: TextView = findViewById(R.id.emoji_text_view)
emojiTextView.text = EmojiCompat.get().process("Hello world! 😃")

The process method processes the text and replaces unsupported emojis with the latest ones.

More Examples

EmojiCompat Example

The EmojiCompat is the main class to keep Android devices up to date with the newest emojis by adding EmojiSpans to a given CharSequence.

It is a singleton class that can be configured using a EmojiCompat.Config instance.

EmojiCompat has to be initialized using init(EmojiCompat.Config) function before it can process a CharSequence:

EmojiCompat.init(/* a config instance */);

It is suggested to make the initialization as early as possible in your app.

Here is the demo screenshot:

Step 1: Create Project

Start by creating an empty Android Studio project.

Step 2: Dependencies

Add emoji-bundled in your app/build.gradle:

    implementation "androidx.emoji:emoji-bundled:$supportVer"

Step 3: Design Layout

Design layout as follows:

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.developers.emojicompat.MainActivity">

    <Button
        android:id="@+id/ok_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="@string/ok_button_text" />

    <TextView
        android:id="@+id/emoji_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="25sp"/>

</LinearLayout>

Step 4: Initialize EmojiCompat

InitApp.kt

package com.developers.emojicompat

import android.app.Application
import androidx.emoji.text.EmojiCompat
import androidx.emoji.text.FontRequestEmojiCompatConfig
import androidx.core.provider.FontRequest
import java.util.logging.Logger

class InitApp : Application() {

    companion object {
        val Log = Logger.getLogger(InitApp::class.java.name)
    }

    override fun onCreate() {
        super.onCreate()
        val fontRequest = FontRequest(
                "com.google.android.gms.fonts",
                "com.google.android.gms",
                "Noto Color Emoji Compat",
                R.array.com_google_android_gms_fonts_certs)
        val config = FontRequestEmojiCompatConfig(this, fontRequest)
        EmojiCompat.init(config)
    }
}

Step : Write MainActivity code

MainActivity.kt

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.emoji.text.EmojiCompat
import android.util.Log
import android.widget.Toast
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    private val WOMAN_TECHNOLOGIST = "\uD83D\uDC69\u200D\uD83D\uDCBB"
    private val WOMAN_SINGER = "\uD83D\uDC69\u200D\uD83C\uDFA4"
    private val emojiContent: String = WOMAN_TECHNOLOGIST + " " + WOMAN_SINGER

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        ok_button.setOnClickListener {
            EmojiCompat.get().registerInitCallback(object : EmojiCompat.InitCallback() {
                override fun onInitialized() {
                    super.onInitialized()
                    Log.d("MainActivity", "EmojiCompat initialized successfully")
                    val processed = EmojiCompat.get().process(emojiContent)
                    emoji_text_view.text = processed
                }

                override fun onFailed(throwable: Throwable?) {
                    super.onFailed(throwable)
                    Toast.makeText(this@MainActivity,
                            throwable?.message ?: "", Toast.LENGTH_SHORT).show()
                }
            })
        }
    }
}

Run

Copy the code or download it in the link below, build and run.

Reference

Here are the reference links:

Number	Link
1.	Download Example
2.	Follow code author
3.	Code: Apache 2.0 License

Conclusion

EmojiCompat in Android is a powerful tool that allows developers to use the latest emojis in their apps, regardless of the Android version running on the device. In this article, we explored EmojiCompat in a step-by-step manner. By following these steps, you can easily add the latest emojis to your app and ensure consistency across different devices and platforms.