Edit screen: add emoji compat

app/build.gradle

@@ -44,6 +44,7 @@ dependencies {
     implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
     implementation 'androidx.navigation:navigation-fragment-ktx:2.0.0'
     implementation 'androidx.navigation:navigation-ui-ktx:2.0.0'
+    implementation 'androidx.emoji:emoji:1.0.0'
     implementation "androidx.preference:preference-ktx:1.1.0-rc01"
 
     implementation 'com.google.android.material:material:1.0.0'

app/src/main/AndroidManifest.xml

@@ -15,6 +15,10 @@
 
     <uses-permission android:name="android.permission.VIBRATE"/>
 
+    <!-- Adding this meta-data will download the font when application is installed from
+        Google Play Store. This way the font will be downloaded and ready when your app starts
+        for the first time. -->
+    <meta-data android:name="fontProviderRequests" android:value="Noto Color Emoji Compat"/>
 
     <application
             android:allowBackup="true"

app/src/main/java/com/automattic/portkey/Portkey.kt

@@ -1,17 +1,54 @@
 package com.automattic.portkey
 
 import android.app.Application
+import android.util.Log
+import androidx.core.provider.FontRequest
+import androidx.emoji.text.EmojiCompat
+import androidx.emoji.text.FontRequestEmojiCompatConfig
+import com.automattic.portkey.R.array
 import com.automattic.portkey.util.CrashLoggingUtils
 
 class Portkey : Application() {
     private var statusBarHeight: Int = 0
 
     override fun onCreate() {
         super.onCreate()
-
         AppPrefs.init(this)
 
         CrashLoggingUtils.startCrashLogging(this)
+
+        initEmojiCompat()
+    }
+
+    private fun initEmojiCompat() {
+        val config: EmojiCompat.Config
+
+        // Use a downloadable font for EmojiCompat
+        val fontRequest = FontRequest(
+            "com.google.android.gms.fonts",
+            "com.google.android.gms",
+            "Noto Color Emoji Compat",
+            array.com_google_android_gms_fonts_certs
+        )
+        config = FontRequestEmojiCompatConfig(applicationContext, fontRequest)
+        config.setReplaceAll(true)
+        config.setUseEmojiAsDefaultStyle(true)
+
+        config.registerInitCallback(object : EmojiCompat.InitCallback() {
+            override fun onInitialized() {
+                Log.d(TAG, "EmojiCompat initialized")
+            }
+
+            override fun onFailed(throwable: Throwable?) {
+                Log.d(TAG, "EmojiCompat initialization failed", throwable)
+            }
+        })
+
+        EmojiCompat.init(config)
+    }
+
+    companion object {
+        const val TAG = "Portkey"
     }
 
     fun setStatusBarHeight(newHeight: Int) {

app/src/main/res/layout/row_emoji.xml

@@ -4,7 +4,7 @@
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
 
-    <TextView
+    <androidx.emoji.widget.EmojiTextView
         android:id="@+id/txtEmoji"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"

app/src/main/res/values/font_certs.xml

@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="utf-8"?>
+    <!--
+     Copyright 2017 The Android Open Source Project
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+         http://www.apache.org/licenses/LICENSE-2.0
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+    -->
+<resources>
+<array name="com_google_android_gms_fonts_certs">
+    <item>@array/com_google_android_gms_fonts_certs_dev</item>
+    <item>@array/com_google_android_gms_fonts_certs_prod</item>
+</array>
+<string-array name="com_google_android_gms_fonts_certs_dev">
+        <item>
+            MIIEqDCCA5CgAwIBAgIJANWFuGx90071MA0GCSqGSIb3DQEBBAUAMIGUMQswCQYDVQQGEwJVUzETMBEGA1UECBMKQ2FsaWZvcm5pYTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEQMA4GA1UEChMHQW5kcm9pZDEQMA4GA1UECxMHQW5kcm9pZDEQMA4GA1UEAxMHQW5kcm9pZDEiMCAGCSqGSIb3DQEJARYTYW5kcm9pZEBhbmRyb2lkLmNvbTAeFw0wODA0MTUyMzM2NTZaFw0zNTA5MDEyMzM2NTZaMIGUMQswCQYDVQQGEwJVUzETMBEGA1UECBMKQ2FsaWZvcm5pYTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEQMA4GA1UEChMHQW5kcm9pZDEQMA4GA1UECxMHQW5kcm9pZDEQMA4GA1UEAxMHQW5kcm9pZDEiMCAGCSqGSIb3DQEJARYTYW5kcm9pZEBhbmRyb2lkLmNvbTCCASAwDQYJKoZIhvcNAQEBBQADggENADCCAQgCggEBANbOLggKv+IxTdGNs8/TGFy0PTP6DHThvbbR24kT9ixcOd9W+EaBPWW+wPPKQmsHxajtWjmQwWfna8mZuSeJS48LIgAZlKkpFeVyxW0qMBujb8X8ETrWy550NaFtI6t9+u7hZeTfHwqNvacKhp1RbE6dBRGWynwMVX8XW8N1+UjFaq6GCJukT4qmpN2afb8sCjUigq0GuMwYXrFVee74bQgLHWGJwPmvmLHC69EH6kWr22ijx4OKXlSIx2xT1AsSHee70w5iDBiK4aph27yH3TxkXy9V89TDdexAcKk/cVHYNnDBapcavl7y0RiQ4biu8ymM8Ga/nmzhRKya6G0cGw8CAQOjgfwwgfkwHQYDVR0OBBYEFI0cxb6VTEM8YYY6FbBMvAPyT+CyMIHJBgNVHSMEgcEwgb6AFI0cxb6VTEM8YYY6FbBMvAPyT+CyoYGapIGXMIGUMQswCQYDVQQGEwJVUzETMBEGA1UECBMKQ2FsaWZvcm5pYTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEQMA4GA1UEChMHQW5kcm9pZDEQMA4GA1UECxMHQW5kcm9pZDEQMA4GA1UEAxMHQW5kcm9pZDEiMCAGCSqGSIb3DQEJARYTYW5kcm9pZEBhbmRyb2lkLmNvbYIJANWFuGx90071MAwGA1UdEwQFMAMBAf8wDQYJKoZIhvcNAQEEBQADggEBABnTDPEF+3iSP0wNfdIjIz1AlnrPzgAIHVvXxunW7SBrDhEglQZBbKJEk5kT0mtKoOD1JMrSu1xuTKEBahWRbqHsXclaXjoBADb0kkjVEJu/Lh5hgYZnOjvlba8Ld7HCKePCVePoTJBdI4fvugnL8TsgK05aIskyY0hKI9L8KfqfGTl1lzOv2KoWD0KWwtAWPoGChZxmQ+nBli+gwYMzM1vAkP+aayLe0a1EQimlOalO762r0GXO0ks+UeXde2Z4e+8S/pf7pITEI/tP+MxJTALw9QUWEv9lKTk+jkbqxbsh8nfBUapfKqYn0eidpwq2AzVp3juYl7//fKnaPhJD9gs=
+        </item>
+</string-array>
+<string-array name="com_google_android_gms_fonts_certs_prod">
+        <item>
+            MIIEQzCCAyugAwIBAgIJAMLgh0ZkSjCNMA0GCSqGSIb3DQEBBAUAMHQxCzAJBgNVBAYTAlVTMRMwEQYDVQQIEwpDYWxpZm9ybmlhMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtHb29nbGUgSW5jLjEQMA4GA1UECxMHQW5kcm9pZDEQMA4GA1UEAxMHQW5kcm9pZDAeFw0wODA4MjEyMzEzMzRaFw0zNjAxMDcyMzEzMzRaMHQxCzAJBgNVBAYTAlVTMRMwEQYDVQQIEwpDYWxpZm9ybmlhMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtHb29nbGUgSW5jLjEQMA4GA1UECxMHQW5kcm9pZDEQMA4GA1UEAxMHQW5kcm9pZDCCASAwDQYJKoZIhvcNAQEBBQADggENADCCAQgCggEBAKtWLgDYO6IIrgqWbxJOKdoR8qtW0I9Y4sypEwPpt1TTcvZApxsdyxMJZ2JORland2qSGT2y5b+3JKkedxiLDmpHpDsz2WCbdxgxRczfey5YZnTJ4VZbH0xqWVW/8lGmPav5xVwnIiJS6HXk+BVKZF+JcWjAsb/GEuq/eFdpuzSqeYTcfi6idkyugwfYwXFU1+5fZKUaRKYCwkkFQVfcAs1fXA5V+++FGfvjJ/CxURaSxaBvGdGDhfXE28LWuT9ozCl5xw4Yq5OGazvV24mZVSoOO0yZ31j7kYvtwYK6NeADwbSxDdJEqO4k//0zOHKrUiGYXtqw/A0LFFtqoZKFjnkCAQOjgdkwgdYwHQYDVR0OBBYEFMd9jMIhF1Ylmn/Tgt9r45jk14alMIGmBgNVHSMEgZ4wgZuAFMd9jMIhF1Ylmn/Tgt9r45jk14aloXikdjB0MQswCQYDVQQGEwJVUzETMBEGA1UECBMKQ2FsaWZvcm5pYTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEUMBIGA1UEChMLR29vZ2xlIEluYy4xEDAOBgNVBAsTB0FuZHJvaWQxEDAOBgNVBAMTB0FuZHJvaWSCCQDC4IdGZEowjTAMBgNVHRMEBTADAQH/MA0GCSqGSIb3DQEBBAUAA4IBAQBt0lLO74UwLDYKqs6Tm8/yzKkEu116FmH4rkaymUIE0P9KaMftGlMexFlaYjzmB2OxZyl6euNXEsQH8gjwyxCUKRJNexBiGcCEyj6z+a1fuHHvkiaai+KL8W1EyNmgjmyy8AW7P+LLlkR+ho5zEHatRbM/YAnqGcFh5iZBqpknHf1SKMXFh4dd239FJ1jWYfbMDMy3NS5CTMQ2XFI1MvcyUTdZPErjQfTbQe3aDQsQcafEQPD+nqActifKZ0Np0IS9L9kR/wbNvyz6ENwPiTrjV2KRkEjH78ZMcUQXg0L3BYHJ3lc69Vs5Ddf9uUGGMYldX3WfMBEmh/9iFBDAaTCK
+        </item>
+</string-array>
+</resources>

photoeditor/build.gradle

@@ -52,6 +52,7 @@ dependencies {
     testImplementation 'junit:junit:4.12'
     androidTestImplementation 'androidx.test:runner:1.2.0'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.2.0'
+    implementation 'androidx.emoji:emoji:1.0.0'
 }
 repositories {
     mavenCentral()

photoeditor/src/main/java/com/automattic/photoeditor/PhotoEditor.kt

@@ -24,6 +24,8 @@ import androidx.annotation.ColorInt
 import androidx.annotation.IntRange
 import androidx.annotation.RequiresPermission
 import androidx.annotation.UiThread
+import androidx.emoji.text.EmojiCompat
+import androidx.emoji.text.EmojiCompat.InitCallback
 import com.automattic.photoeditor.gesture.MultiTouchListener
 import com.automattic.photoeditor.gesture.MultiTouchListener.OnMultiTouchListener
 import com.automattic.photoeditor.util.BitmapUtil
@@ -48,6 +50,7 @@ import java.io.File
 import java.io.FileInputStream
 import java.io.FileOutputStream
 import java.util.ArrayList
+import java.lang.ref.WeakReference
 
 /**
  *
@@ -367,9 +370,31 @@ class PhotoEditor private constructor(builder: Builder) :
 
             if (emojiTypeface != null) {
                 emojiTextView.typeface = emojiTypeface
+                emojiTextView.text = emojiName
+            } else {
+                // if user did not set a specific emojiTypeface, use EmojiCompat to process
+                // the string and make sure we have an emoji that can be rendered
+                EmojiCompat.get().registerInitCallback(object : EmojiCompat.InitCallback() {
+                    val regularTextViewRef = WeakReference(emojiTextView)
+                    override fun onInitialized() {
+                        EmojiCompat.get().unregisterInitCallback(this)
+
+                        val regularTextView = regularTextViewRef.get()
+                        if (regularTextView != null) {
+                            val compat = EmojiCompat.get()
+                            regularTextView.text = compat.process(emojiName)
+                        }
+                    }
+
+                    override fun onFailed(throwable: Throwable?) {
+                        EmojiCompat.get().unregisterInitCallback(this)
+
+                        // just fallback to setting the text
+                        emojiTextView.text = emojiName
+                    }
+                })
             }
             emojiTextView.textSize = 56f
-            emojiTextView.text = emojiName
 
             // hide cross and background borders for now
             imgClose.visibility = View.GONE
@@ -418,7 +443,7 @@ class PhotoEditor private constructor(builder: Builder) :
                 rootView = layoutInflater.inflate(R.layout.view_photo_editor_text, null)
                 if (rootView.tvPhotoEditorText != null && mDefaultTextTypeface != null) {
                     rootView.tvPhotoEditorText.gravity = Gravity.CENTER
-                    if (mDefaultEmojiTypeface != null) {
+                    if (mDefaultTextTypeface != null) {
                         rootView.tvPhotoEditorText.typeface = mDefaultTextTypeface
                     }
                 }