Emoji-Auswahl

Die Emoji-Auswahl ist eine UI-Lösung, die ein modernes Design bietet Emojis und eine einfache Bedienbarkeit. Nutzer können Emojis und ihre Varianten suchen und auswählen oder eines ihrer zuletzt verwendeten Emojis auswählen.

<ph type="x-smartling-placeholder">
</ph> <ph type="x-smartling-placeholder"> <ph type="x-smartling-placeholder">
</ph> Abbildung 1: Emoji-Auswahl

Mit dieser Mediathek können Apps aus verschiedenen Quellen eine inklusive und Nutzern eine einheitliche Emoji-Erfahrung bieten, ohne dass Entwickler und eine eigene Emoji-Auswahl erstellen.

Funktionen

Aktuelle Emojis

Neu veröffentlichte Emojis sind selektiv in der Emoji-Auswahl enthalten. Die Die Emoji-Auswahlbibliothek ist mit verschiedenen Android-Versionen und Geräte.

Fixierte Varianten

Halten Sie ein Emoji lange gedrückt, um ein Menü mit Varianten aufzurufen, z. B. verschiedene Geschlechts oder Hauttönen. Die ausgewählte Variante wird in der Emoji-Auswahl gespeichert. und die zuletzt ausgewählte Variante wird im Hauptsteuerfeld angezeigt.

Mit dieser Funktion können Nutzer ihre bevorzugten Emoji-Varianten mit nur einem antippen.

<ph type="x-smartling-placeholder">
</ph> Emoji-Varianten <ph type="x-smartling-placeholder">
</ph> Abbildung 2: Emoji-Varianten

Letzte Emojis

<ph type="x-smartling-placeholder">
</ph> neuestes Emoji <ph type="x-smartling-placeholder">
</ph> Abbildung 3: Zuletzt verwendete Emojis

RecentEmojiProvider ist für die Bereitstellung von Emojis im Kürzlich verwendet. In der Mediathek gibt es einen standardmäßigen Anbieter für kürzlich verwendete Emojis die den häufigsten Anwendungsfall erfüllt:

  • Alle ausgewählten Emojis werden für jede App in den gemeinsamen Einstellungen gespeichert.
  • In der Auswahl werden maximal 3 Zeilen ausgewählter Emojis angezeigt, dedupliziert und in umgekehrter Reihenfolge angezeigt. in chronologischer Reihenfolge.

Wenn dieses Standardverhalten ausreicht, müssen Sie nicht setRecentEmojiProvider()

Möglicherweise müssen Sie jedoch das Verhalten des Anbieters anpassen. Hier sind einige häufige Szenarien:

  • Sie möchten unterschiedliche ausgewählte Emojis pro Nutzerkonto speichern.
  • Sie möchten einen anderen Datenspeicher als gemeinsame Einstellungen verwenden.
  • Sie möchten kürzlich verwendete Emojis nach Häufigkeit sortiert anzeigen lassen.

Sie können dann die Schnittstelle RecentEmojiProvider implementieren und festlegen: setRecentEmojiProvider().

Kompatibilität mit EmojiCompat

Wenn diese Option aktiviert ist, wird eine EmojiCompat-Instanz in der Emoji-Auswahl verwendet um so viele Emojis wie möglich zu rendern. Für die Emoji-Auswahl sind keine EmojiCompat jedoch.

Voraussetzungen

Deine App muss auf Android 5.0 (API-Level 21) oder höher ausgerichtet sein.

Bibliothek verwenden

  1. androidx.emoji2:emojipicker:$version in die build.gradle deiner App importieren -Datei.

    dependencies {
        implementation "androidx.emoji2:emojipicker:$version"
    }
    
  2. Maximieren Sie die Ansicht der Emoji-Auswahl und legen Sie optional emojiGridRows und emojiGridColumns.

    • Die Standardanzahl von emojiGridColumns ist 9.
    • Die Zeilenanzahl wird basierend auf der Höhe der übergeordneten Ansicht und dem Wert der emojiGridColumns
    • Verwenden Sie einen Gleitkommawert für emojiGridRows, um anzuzeigen, dass der Nutzer scrollen Sie nach unten, um weitere Emojis zu sehen.
    <androidx.emoji2.emojipicker.EmojiPickerView
        android:id="@+id/emoji_picker"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:emojiGridColumns="9" />
    
    val emojiPickerView = EmojiPickerView(context).apply {
        emojiGridColumns = 15
        layoutParams = ViewGroup.LayoutParams(
            ViewGroup.LayoutParams.MATCH_PARENT,
            ViewGroup.LayoutParams.MATCH_PARENT
        )
    }
    
    findViewById<ViewGroup>(R.id.emoji_picker_layout).addView(emojiPickerView)
    
  3. Verwenden Sie setOnEmojiPickedListener(), um die ausgewählten Emojis einer Ansicht hinzuzufügen. So hängen Sie beispielsweise an ein EditText an:

    emojiPickerView.setOnEmojiPickedListener {
        findViewById<EditText>(R.id.edit_text).append(it.emoji)
    }
    
  4. Legen Sie optional RecentEmojiProvider fest. Ein Beispiel finden Sie in der Beispiel-App. Implementierung.

  5. Passen Sie die Stile bei Bedarf an. Eigenes Design erstellen, um allgemeines Design zu überschreiben und wenden Sie den Stil auf EmojiPickerView an. Beispiel: Durch das Überschreiben von colorControlNormal wird die Farbe des Kategoriesymbols geändert.

    <style name="CustomStyle" >
        <item name="colorControlNormal">#FFC0CB</item>
    </style>
    <androidx.emoji2.emojipicker.EmojiPickerView
        android:id="@+id/emoji_picker"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:theme="@style/CustomStyle"
        app:emojiGridColumns="9" />
    

Beispiel-App

Die Beispiel-App Emoji Picker veranschaulicht grundlegende Anwendungsfälle und folgende zusätzliche Szenarien:

  • Neuberechnung des Layouts, wenn emojiGridRows oder emojiGridColumns zurückgesetzt werden.
  • Ein überschriebener aktueller Emoji-Anbieter, der nach Häufigkeit sortiert.
  • Zusätzliche Stilanpassung.