Отображать смайлы

Стандартный набор смайлов ежегодно обновляется Unicode , поскольку использование смайлов быстро растет для всех типов приложений.

Если ваше приложение отображает интернет-контент или обеспечивает ввод текста, мы настоятельно рекомендуем поддерживать новейшие шрифты эмодзи. В противном случае более поздние смайлы могут отображаться в виде небольшого квадратного прямоугольника под названием тофу (☐) или других неправильно отображаемых последовательностей смайлов.

Android версии 11 (уровень API 30) и ниже не может обновить шрифт эмодзи, поэтому приложения, отображающие их в этих версиях, необходимо обновлять вручную.

Ниже приведены примеры современных смайлов.

Примеры Версия
🫠 🫱🏼‍🫲🏿 🫰🏽 14,0 (сентябрь 2021 г.)
😶‍🌫️ 🧔🏻‍♀️ 🧑🏿‍❤️‍🧑🏾 13.1 (сентябрь 2020 г.)
🥲 🥷🏿 🐻‍❄️ 13,0 (март 2020 г.)
🧑🏻‍🦰 🧑🏿‍🦯 👩🏻‍🤝‍👩🏼 12.1 (октябрь 2019 г.)
🦩 🦻🏿 👩🏼‍🤝‍👩🏻 12.0 (февраль 2019 г.)

В спецификации за март 2023 г. ( Compose UI 1.4 ) реализована поддержка последней версии смайлов , включая обратную совместимость со старыми версиями Android вплоть до API 21.

Эта поддержка не требует никаких изменений в вашем приложении — если вы используете Text и TextField (Material 2 или Material 3) или BasicText и BasicTextField , вы получаете современную поддержку эмодзи «из коробки».

Лучший способ протестировать последние смайлы в вашем приложении — использовать реальное устройство с API 30 или ниже.

Если вы используете собственное решение для смайлов или вам необходимо отключить разрешение смайлов по умолчанию в Compose по какой-либо другой причине, вы можете использовать PlatformTextStyle(emojiSupportMatch) : 

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

Совместимость

Если ваше приложение использует и Views, и Compose в одном и том же Activity , убедитесь, что вы используете соответствующие 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
            }
        }
    }
}
EmojiSnippets.kt

Затем в вашем XML-файле: 

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

Расширение из AppCompatActivity

Если ваша Activity простирается от AppCompatActivity , вы можете использовать ComposeView для вызова составных функций. Эмодзи корректно отображаются в разных версиях Android при использовании составных элементов текста.

Если вы расширяете AppCompatActivity , разверните TextView из XML, чтобы смайлы отображались правильно.

Это применимо, если вы раздуваете XML:

  • вне ComposeView , в Activity . Обратите внимание на использование AppCompatActivity и TextView в следующем фрагменте:

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
            }
        }
    }
}
EmojiSnippets.kt

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
                        }
                    }
                }
            }
        )
    }
}
EmojiSnippets.kt

Чтобы раздуть текст с помощью AndroidView внутри ComposeView , используйте 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 }
                        )
                    }
                }
            }
        )
    }
}
EmojiSnippets.kt

Подробности см. в документации по API совместимости .

Поиск неисправностей

Если вместо смайлика вы видите тофу (☐), сначала проверьте, не связана ли проблема с вашим конкретным тестовым устройством. Есть несколько основных вещей, которые вы можете проверить:

{% дословно %} {% дословно %} {% дословно %} {% дословно %}