Emojis einblenden

Der Standardsatz an Emojis wird jährlich von Unicode aktualisiert, da die Verwendung von Emojis für alle Arten von Apps rasant zunimmt.

Wenn in Ihrer App Internetinhalte angezeigt werden oder Texteingaben möglich sind, empfehlen wir dringend, die neuesten Emoji-Schriftarten zu unterstützen. Andernfalls werden spätere Emojis möglicherweise als kleines Quadrat (☐), das als Tofu bezeichnet wird, oder als andere falsch gerenderte Emoji-Sequenzen angezeigt.

Bei Android-Versionen 11 (API-Level 30) und niedriger kann die Emoji-Schriftart nicht aktualisiert werden. Apps, in denen Emojis auf diesen Versionen angezeigt werden, müssen daher manuell aktualisiert werden.

Im Folgenden finden Sie Beispiele für moderne Emojis.

Beispiele Version
🫩 🪉 🇨🇶 16.0 (September 2024)
🐦‍🔥 🧑‍🧑‍🧒‍🧒 👩🏽‍🦽‍➡️ 🇲🇶 15.1 (September 2023)
🩷 🫸🏼 🐦‍⬛ 15.0 (September 2022)
🫠 🫱🏼‍🫲🏿 🫰🏽 14.0 (September 2021)
😶‍🌫️ 🧔🏻‍♀️ 🧑🏿‍❤️‍🧑🏾 13.1 (September 2020)
🥲 🥷🏿 🐻‍❄️ 13.0 (März 2020)
🧑🏻‍🦰 🧑🏿‍🦯 👩🏻‍🤝‍👩🏼 12.1 (Oktober 2019)
🦩 🦻🏿 👩🏼‍🤝‍👩🏻 12.0 (Februar 2019)

BOM März 2023 (Compose UI 1.4) bietet Unterstützung für die neueste Emoji-Version, einschließlich Abwärtskompatibilität mit älteren Android-Versionen bis hinunter zu API 21.

Für diese Unterstützung sind keine Änderungen an Ihrer App erforderlich. Wenn Sie Text und TextField (Material 2 oder Material 3) oder BasicText und BasicTextField verwenden, erhalten Sie automatisch Unterstützung für moderne Emojis.

Am besten testen Sie die neuesten Emojis in Ihrer App auf einem echten Gerät mit API 30 oder niedriger.

Wenn Sie eine benutzerdefinierte Emoji-Lösung verwenden oder die Standard-Emoji-Auflösung in Compose aus einem anderen Grund deaktivieren müssen, können Sie PlatformTextStyle(emojiSupportMatch) verwenden:

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

Interoperabilität

Wenn Ihre App sowohl Views als auch Compose im selben Activity verwendet, müssen Sie die entsprechenden APIs verwenden, um Emojis richtig zu konfigurieren. In den folgenden Abschnitten wird beschrieben, wann Sie die einzelnen APIs verwenden sollten.

Verlängerung ab ComponentActivity

Wenn Ihre Activity von Compose ComponentActivity anstelle von AppCompatActivity abgeleitet wird, folgen Sie der Anleitung unter Emojis ohne AppCompat unterstützen.

Da Sie AppCompatActivity nicht erweitern, fügen Sie die Emoji2-Bibliothek zu Ihren Abhängigkeiten hinzu und verwenden Sie EmojiTextView in Ihren Ansichten anstelle des Widgets TextView, wie im folgenden Snippet gezeigt:

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

Gehen Sie dann in Ihrer XML-Datei so vor:

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

Verlängerung ab AppCompatActivity

Wenn sich Ihr Activity von AppCompatActivity ableitet, können Sie mit ComposeView zusammensetzbare Funktionen aufrufen. Emojis werden in allen Android-Versionen korrekt gerendert, wenn Sie Text-Composables verwenden.

Wenn Sie AppCompatActivity erweitern, müssen Sie TextView aus XML aufblähen, damit Emojis richtig gerendert werden.

Dies gilt, wenn Sie das XML aufblähen:

  • außerhalb von ComposeView in der Activity. Beachten Sie die Verwendung von AppCompatActivity und TextView im folgenden Snippet:

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

Wenn Sie einen Text mit AndroidView innerhalb von ComposeView aufblähen möchten, verwenden Sie AppCompatTextView, um Emojis richtig zu rendern:

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

Weitere Informationen finden Sie in der Dokumentation zu den Interoperability APIs.

Fehlerbehebung

Wenn Sie anstelle des Emojis Tofu (☐) sehen, prüfen Sie zuerst, ob das Problem an Ihrem Testgerät liegt. Das kann hauptsächlich aus folgenden Gründen passieren: