顯示表情符號

由於所有類型的應用程式的表情符號用量越來越快速,因此標準表情符號組合每年都會由萬國碼 (Unicode) 更新

如果應用程式會顯示網際網路內容或提供文字輸入,強烈建議支援最新的表情符號字型。否則,之後的表情符號可能會以名為「tofu」的小正方形方塊 (☐) 或其他錯誤轉譯的表情符號序列顯示。

Android 11 (API 級別 30) 以下版本無法更新表情符號字型,因此在這些版本中顯示這些字型的應用程式,必須手動更新。

以下是現代表情符號的範例。

範例 版本
🫠? 🫱? 🫲? 🫰? 14.0 (2021 年 9 月)
😶‍🌫️ 🧔🏻‍♀️ 🧑🏿‍❤️‍🧑🏾 13.1 (2020 年 9 月)
🥲 🥷🏿 🐻‍❄️ 13.0 (2020 年 3 月)
🧑🏻‍🦰 🧑🏿‍🦯 👩🏻‍🤝‍👩🏼 12.1 (2019 年 10 月)
🦩 🦻🏿 👩🏼‍🤝‍👩🏻 12.0 (2019 年 2 月)

2023 年 3 月 BOM (Compose UI 1.4) 支援最新的表情符號版本,包括與舊版 Android 至 API 21 的回溯相容性。

無須變更應用程式就能支援這項支援功能:如果您使用 TextTextField (Material 2 或 Material 3) 或 BasicTextBasicTextField,直接支援新型表情符號。

如要測試應用程式中最新的表情符號,最佳做法是使用 API 30 以下版本的實際裝置。

如果您使用自訂表情符號解決方案,或基於任何其他原因需要在 Compose 中停用預設的表情符號解析度,可以使用 PlatformTextStyle(emojiSupportMatch)

Text(
    text = "Hello $EMOJI_TEXT",
    style = TextStyle(
        platformStyle = PlatformTextStyle(
            emojiSupportMatch = EmojiSupportMatch.None
        )/* ... */
    )
)

可互通

如果應用程式在同一個 Activity 中同時使用 View 和 Compose,請務必使用適當的 API 正確設定表情符號。以下各節說明各個 API 的使用時機。

從「ComponentActivity」延伸

如果 Activity 來自 Compose ComponentActivity 而非 AppCompatActivity,請按照不使用 AppCompat 的支援表情符號的說明操作。

由於並未擴充 AppCompatActivity,請將 Emoji2 程式庫新增至依附元件,並在檢視畫面中使用 EmojiTextView,而非 TextView 小工具,如以下程式碼片段所示:

class MainActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val emojiTextView: EmojiTextView = findViewById(R.id.emoji_text_view)
        emojiTextView.text = getString(R.string.emoji_text_view, EMOJI_TEXT)

        val composeView: ComposeView = findViewById(R.id.compose_view)

        composeView.apply {
            setContent {
                // compose code
            }
        }
    }
}

接著在 XML 檔案中:

<androidx.emoji2.widget.EmojiTextView
    android:id="@+id/emoji_text_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    />

從「AppCompatActivity」延伸

如果 ActivityAppCompatActivity 擴充,您可以使用 ComposeView 呼叫可組合函式。使用文字可組合函式時,表情符號可在各種 Android 版本上正確顯示。

如果您是從 AppCompatActivity 擴充,請從 XML 加載 TextView,即可正確顯示表情符號。

如果是加載 XML,則適用以下情況:

  • ComposeView 外部的 Activity。請注意以下程式碼片段中 AppCompatActivityTextView 的用法:

class MyActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val emojiTextView: TextView = findViewById(R.id.emoji_text_view)
        emojiTextView.text = getString(R.string.emoji_text_view, EMOJI_TEXT)

        val composeView: ComposeView = findViewById(R.id.compose_view)

        composeView.apply {
            setContent {
                // compose code
            }
        }
    }
}

class MyActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContentView(
            ComposeView(this).apply {
                setContent {
                    Column {
                        Text(EMOJI_TEXT)

                        AndroidViewBinding(ExampleViewBinding::inflate) {
                            emojiTextView.text = EMOJI_TEXT
                        }
                    }
                }
            }
        )
    }
}

如要在 ComposeView 中使用 AndroidView 加載文字,請使用 AppCompatTextView 正確轉譯表情符號:

class MyActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContentView(
            ComposeView(this).apply {
                setContent {
                    Column {
                        Text(EMOJI_TEXT)

                        AndroidView(
                            factory = { context -> AppCompatTextView(context) },
                            update = { it.text = EMOJI_TEXT }
                        )
                    }
                }
            }
        )
    }
}

詳情請參閱互通性 API 說明文件。

疑難排解

如果您看到「tofu」 (☐),而不是表情符號,請先檢查問題是否出在您指定的測試裝置。請檢查幾個主要項目: