Emoji-Auswahl

Die Emoji-Auswahl ist eine UI-Lösung, die ein modernes Design, aktuelle Emojis und eine einfache Bedienung bietet. Nutzer können Emojis und ihre Varianten durchsuchen und auswählen oder aus ihren zuletzt verwendeten Emojis auswählen.

Mit dieser Bibliothek können Apps aus verschiedenen Quellen ihren Nutzern eine inklusive und einheitliche Emoji-Auswahl bieten, ohne dass Entwickler eine eigene Emoji-Auswahl von Grund auf neu erstellen und pflegen müssen.

Features

Die Emoji-Auswahl hat die folgenden Funktionen.

Emoji für „Auf dem neuesten Stand“

Neu veröffentlichte Emojis werden selektiv in die Emoji-Auswahl aufgenommen. Die Emoji-Auswahl-Bibliothek ist mit mehreren Android-Versionen und ‑Geräten kompatibel.

Fixierte Varianten

Drücke lange auf ein Emoji, um ein Menü mit Varianten wie verschiedenen Geschlechtern oder Hauttönen aufzurufen. Die ausgewählte Variante wird in der Emoji-Auswahl gespeichert und die zuletzt ausgewählte Variante wird im Hauptbereich verwendet.

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

Zuletzt verwendete Emojis

Der RecentEmojiProvider ist für die Bereitstellung von Emojis in der Kategorie Zuletzt verwendet verantwortlich. Die Bibliothek hat einen Standardanbieter für zuletzt verwendete Emojis, der den häufigsten Anwendungsfall abdeckt:

• Alle ausgewählten Emojis werden pro App in den freigegebenen Einstellungen gespeichert.
• In der Auswahl werden maximal drei Zeilen mit ausgewählten Emojis angezeigt, die dedupliziert und in umgekehrter chronologischer Reihenfolge sortiert sind.

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

Möglicherweise müssen Sie das Verhalten des Anbieters jedoch anpassen. Im Folgenden werden einige häufige Szenarien aufgeführt:

• Sie möchten für jedes Nutzerkonto unterschiedliche ausgewählte Emojis speichern.
• Sie möchten einen anderen Datenspeicher als „Shared Preferences“ verwenden.
• Sie möchten die zuletzt verwendeten Emojis nach Häufigkeit sortiert anzeigen.

Anschließend können Sie die Schnittstelle RecentEmojiProvider implementieren und mit setRecentEmojiProvider() festlegen.

Richtungsauswahl

Ab Emoji 15.1 unterstützt die Emoji-Auswahl bidirektionale Emojis. Nutzer können auf den bidirektionalen Schalter tippen, um zwischen nach links und nach rechts ausgerichteten Versionen von Emojis zu wechseln.

Abbildung 4: Bidirektionales Emoji, das nach links zeigt.

Abbildung 5: Bidirektionales Emoji, das nach rechts zeigt.

Auswahl für Emojis mit mehreren Personen

Nutzer können Emoji-Paare gedrückt halten, um eine Auswahl an Emojis mit mehreren Personen anzuzeigen.

Abbildung 6. Halte ein Emoji-Paar gedrückt, um die Auswahl an Emojis mit mehreren Personen anzuzeigen.

Abbildung 7. Wähle ein Emoji mit einer Person auf der linken Seite aus.

Abbildung 8. Wählen Sie ein Emoji mit einer Person auf der rechten Seite aus.

Wenn der Nutzer die linke oder rechte Hälfte eines Emoji-Paars auswählt, wird unten rechts eine Vorschau angezeigt (siehe Abbildungen 7 und 8). Nachdem beide Hälften des Emoji-Paars ausgewählt wurden, können Nutzer die Vorschau auswählen, um das benutzerdefinierte Emoji-Paar zusammenzustellen.

Kompatibilität mit EmojiCompat

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

Vorbereitung

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

Bibliothek verwenden

1. Importieren Sie androidx.emoji2:emojipicker:$version in die Datei build.gradle Ihrer Anwendung.

   dependencies {
       implementation "androidx.emoji2:emojipicker:$version"
   }
   

2. Blähe die Ansicht der Emoji-Auswahl auf und lege optional emojiGridRows und emojiGridColumns fest.

   • Der Standardwert für emojiGridColumns ist 9.
   • Die Zeilenanzahl wird anhand der Höhe der übergeordneten Ansicht und des Werts von emojiGridColumns berechnet.
   • Verwenden Sie einen Gleitkommawert für emojiGridRows, um anzugeben, dass der Nutzer scrollen kann, 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 das ausgewählte Emoji an eine Ansicht anzuhängen. So hängen Sie beispielsweise etwas an ein EditText an:

   emojiPickerView.setOnEmojiPickedListener {
       findViewById<EditText>(R.id.edit_text).append(it.emoji)
   }
   

4. Legen Sie optional RecentEmojiProvider fest. Ein Beispiel für die Implementierung finden Sie in der Beispiel-App.

5. Passen Sie die Stile optional an. Erstellen Sie einen eigenen Stil, um gängige Designattribute zu überschreiben, und wenden Sie den Stil auf EmojiPickerView an. Wenn Sie beispielsweise colorControlNormal überschreiben, ändert sich die Farbe des Kategoriesymbols.

   <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 für die Emoji-Auswahl zeigt grundlegende Anwendungsfälle sowie die folgenden zusätzlichen Szenarien:

• Neuberechnung des Layouts, wenn emojiGridRows oder emojiGridColumns zurückgesetzt werden.
• Ein überschriebener Anbieter für zuletzt verwendete Emojis, der nach Häufigkeit sortiert.
• Zusätzliche Stilanpassung.