Selektor emotikonów

Selektor emotikonów to rozwiązanie UI, które oferuje nowoczesny wygląd i odświeżone emotikony oraz jest łatwe w użyciu. Użytkownicy mogą przeglądać i wybierać emotikony oraz ich warianty lub wybrać ostatnio używany emotikon.

Dzięki tej bibliotece aplikacje z różnych źródeł mogą zapewniać użytkownikom przyjazne i zjednoczone emoji bez konieczności tworzenia i utrzymywania własnego selektora emoji od podstaw.

Funkcje

Selektor emotikonów ma te funkcje:

Aktualne emotikony

Nowo opublikowane emotikony są dodawane do selektora emotikonów w sposób selektywny. Biblioteka selektorów emotikonów jest zgodna z wieloma wersjami Androida i różnych urządzeń.

Wersje przyklejone

Przytrzymaj emotikon, aby wyświetlić menu wariantów, np. różne płcie czy odcienie skóry. Wybrany wariant jest zapisywany w selektorze emotikonów, a w panelu głównym jest używany ostatni wybrany wariant.

Dzięki tej funkcji użytkownicy mogą wysyłać wybrane emotikony jednym kliknięciem.

Najnowsze emotikony

RecentEmojiProvider jest odpowiedzialny za udostępnianie emotikonów w kategorii Ostatnio używane. Biblioteka ma domyślnego dostawcę emotikonów, który spełnia większość typowych przypadków użycia:

• Wszystkie wybrane emotikony są zapisywane w ustawieniach wspólnych dla poszczególnych aplikacji.
• Selektor wyświetla maksymalnie 3 wiersze wybranych emotikonów, bez duplikatów, w odwrotnej kolejności chronologicznej.

Jeśli to domyślne działanie jest wystarczające, nie musisz używać setRecentEmojiProvider().

Może jednak być konieczne dostosowanie działania dostawcy. Oto kilka typowych scenariuszy:

• Chcesz przechowywać różne wybrane emotikony w zależności od konta użytkownika.
• Chcesz używać miejsca na dane innego niż udostępnione ustawienia.
• Chcesz wyświetlić ostatnio używane emotikony posortowane według częstotliwości użycia.

Następnie możesz zaimplementować interfejs RecentEmojiProvider i skonfigurować go za pomocą setRecentEmojiProvider().

Selektor kierunku

Począwszy od Emoji 15.1 selektor emotikonów obsługuje dwukierunkowe emotikony. Użytkownicy mogą kliknąć przełącznik dwukierunkowy, aby przełączać się między wersjami emotikonów skierowanymi w lewo i w prawo.

Rysunek 4. Dwukierunkowy emotikon skierowany w lewo.

Rysunek 5. Dwukierunkowy emotikon zwrócony w prawo.

Wybór emotikonów z wieloma osobami

Użytkownicy mogą nacisnąć i przytrzymać emotikony, aby wyświetlić wybór emotikonów dla wielu osób.

Rysunek 6. Naciśnij i przytrzymaj parę emotikonów, aby wyświetlić emotikony z wieloma osobami.

Rysunek 7. Wybierz emotikon z połówką twarzy po lewej stronie.

Rysunek 8. Wybierz emotikon przedstawiający osobę po prawej stronie.

Gdy użytkownik wybierze lewą lub prawą połowę emotikonu w parze emotikonów, selektor wyświetli podgląd w prawym dolnym rogu, jak pokazano na rysunkach 7 i 8. Po wybraniu obu połów emotikonów użytkownicy mogą wybrać podgląd, aby utworzyć niestandardową parę emotikonów.

Zgodność z EmojiCompat

Jeśli jest włączona, w selektorze emotikonów jest używana instancja EmojiCompat, aby renderować jak najwięcej emotikonów. Selektor emotikonów nie wymaga jednak EmojiCompat.

Wymagania wstępne

Aplikacja musi być kierowana na Androida 5.0 (poziom interfejsu API 21) lub nowszego.

Korzystanie z biblioteki

1. Zaimportuj androidx.emoji2:emojipicker:$version do pliku build.gradle aplikacji.

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

2. Rozwiń widok selektora emotikonów i opcjonalnie ustaw emojiGridRows i emojiGridColumns.

   • Domyślna liczba elementów emojiGridColumns to 9.
   • Liczba wierszy jest obliczana na podstawie wysokości widoku nadrzędnego i wartości parametru emojiGridColumns.
   • Użyj wartości zmiennoprzecinkowej emojiGridRows, aby wskazać, że użytkownik może przewinąć ekran, aby znaleźć więcej emotikonów.

   <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. Aby dodać wybrany emotikon do widoku, użyj setOnEmojiPickedListener(). Aby na przykład dołączyć do EditText, wykonaj te czynności:

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

4. Opcjonalnie ustaw RecentEmojiProvider. Przykładową implementację znajdziesz w przykładowej aplikacji.

5. Opcjonalnie dostosuj style. Utwórz własny styl, aby zastąpić typowe atrybuty motywu, i zastosuj go do elementu EmojiPickerView. Na przykład zastąpienie wartości colorControlNormal zmienia kolor ikony kategorii.

   <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" />
   

Przykładowa aplikacja

Przykładowa aplikacja Selektor emotikonów demonstruje podstawowe przypadki użycia oraz te dodatkowe:

• ponowne obliczenie układu po zresetowaniu emojiGridRows lub emojiGridColumns;
• Zastąpiony ostatni dostawca emotikonów, który sortuje je według częstotliwości.
• dodatkowe dostosowywanie stylu;