Selektor emotikonów

Selektor emotikonów to interfejs, który oferuje nowoczesny wygląd i aktualność emotikony i łatwość obsługi. Użytkownicy mogą przeglądać i wybierać emotikony oraz ich warianty lub wybrać ostatnio używany emotikon.

Rysunek 1. Selektor emotikonów
.

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 oferuje te funkcje.

Aktualny emotikon

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

Warianty przyklejone

Przytrzymaj emotikona, aby wyświetlić menu z wariantami, np. z różnymi płciami lub odcieniami 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ć preferowane wersje emotikonów jednym kliknięciem.

warianty emotikonów
Rysunek 2. Warianty emotikonów.

Najnowsze emotikony

ostatni emotikon
Rysunek 3. 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 przypadku każdej aplikacji w ramach wspólnych preferencji.
  • 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ć ostatnie emotikony posortowane według częstotliwości.

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

Wybór kierunku

Od Emoji 15.1 Selektor emotikonów obsługuje dwukierunkowy emotikon. Użytkownicy mogą kliknąć przełącznik dwukierunkowy, aby przełączać się między wersjami emotikonów skierowanymi w lewo i w prawo.

emotikon dwukierunkowy po lewej

Rysunek 4. Dwukierunkowy emotikon skierowany w lewo.

emotikon dwukierunkowy w prawo

Rysunek 5. Dwukierunkowy emotikon zwrócony w prawo.

Wybór emotikonów z wieloma osobami

Użytkownicy mogą dotknąć i przytrzymać emotikony pary, aby wyświetlić emotikony z wieloma osobami.

Naciśnij i przytrzymaj emotikon pary

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

kliknij emotikon człowieka po lewej stronie

Rysunek 7. Wybierz emotikon po lewej stronie.

kliknij odpowiednią osobę emotikonu

Rysunek 8. Wybierz emotikon z prawą połową ekranu.

Gdy użytkownik wybierze lewą lub prawą połowę pary emotikonów, W prawym dolnym rogu selektora pojawia się podgląd, tak jak na ilustracjach 7 i 8. Po wybraniu obu połówek pary emotikonów użytkownicy mogą wybrać podgląd. aby utworzyć parę niestandardowych emotikonów.

Zgodność z EmojiCompat

Jeśli jest włączona, w selektorze emotikonów jest używany element 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. Importuj androidx.emoji2:emojipicker:$version do konta build.gradle aplikacji .

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

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

    • Wartość domyślna parametru emojiGridColumns to 9.
    • Liczba wierszy jest obliczana na podstawie wysokości widoku nadrzędnego i wartości parametru emojiGridColumns.
    • Użyj wartości zmiennoprzecinkowej dla atrybutu emojiGridRows, aby wskazać, że użytkownik może przewiń, aby zobaczyć 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. Użyj przycisku setOnEmojiPickedListener(), aby dołączyć wybrany emotikon do widoku. Aby na przykład dołączyć do elementu EditText, wykonaj te czynności:

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

  4. Opcjonalnie ustaw atrybut RecentEmojiProvider. Zobacz przykładową aplikację. implementacji.

  5. Opcjonalnie dostosuj style. Utwórz własny styl, aby zastąpić wspólny motyw i zastosuj styl do 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:

  • przeliczenie 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;