Selettore di emoji

Il selettore di emoji è una soluzione UI che offre un aspetto moderno e aggiornato emoji e facilità d'uso. Gli utenti possono sfogliare e selezionare le emoji e le loro varianti o scegli tra le emoji usate di recente.

Figura 1. Selettore di emoji
di Gemini Advanced.
.

Con questa raccolta, le app provenienti da una varietà di fonti possono fornire un'esperienza inclusiva e un'esperienza unificata con emoji per i loro utenti senza che gli sviluppatori debbano creare e mantenere il proprio selettore di emoji da zero.

Funzionalità

Emoji aggiornate

Le emoji appena rilasciate vengono incluse selettivamente nel selettore di emoji. La La libreria del selettore di emoji è compatibile con diverse versioni Android e dispositivi mobili.

Varianti persistenti

Tieni premuto a lungo su un'emoji per visualizzare un menu di varianti, ad esempio diverse generi o tonalità di pelle. La variante scelta viene salvata nel selettore di emoji. e l'ultima variante selezionata viene utilizzata nel riquadro principale.

Con questa funzionalità, gli utenti possono inviare le varianti di emoji preferite con una tocca.

varianti di emoji
. Figura 2. Varianti di emoji
di Gemini Advanced.
.

Emoji recenti

emoji recente
. Figura 3. Emoji recenti
di Gemini Advanced.
.

Il RecentEmojiProvider ha la responsabilità di fornire le emoji nel Categoria Utilizzate di recente. La raccolta ha un fornitore di emoji recente predefinito che soddisfa il caso d'uso più comune:

  • Tutte le emoji selezionate vengono salvate per app nelle preferenze condivise.
  • Il selettore mostra al massimo 3 righe di emoji selezionate, deduplicate, al contrario in ordine cronologico.

Se questo comportamento predefinito è sufficiente, non è necessario utilizzare setRecentEmojiProvider().

Tuttavia, potresti dover personalizzare il comportamento del provider. Ecco alcuni esempi di scenari comuni:

  • Vuoi memorizzare diverse emoji selezionate per account utente.
  • Desideri utilizzare uno spazio di archiviazione dei dati diverso dalle preferenze condivise.
  • Vuoi visualizzare le emoji recenti ordinate per frequenza.

Puoi quindi implementare l'interfaccia RecentEmojiProvider e impostarla utilizzando setRecentEmojiProvider().

Compatibilità con EmojiCompat

Se attivata, viene utilizzata un'istanza EmojiCompat nel selettore di emoji per eseguire il rendering del maggior numero possibile di emoji. Il selettore di emoji non richiede Tuttavia, EmojiCompat.

Prerequisiti

La tua app deve avere come target Android 5.0 (livello API 21) o versioni successive.

Utilizzare la libreria

  1. Importa androidx.emoji2:emojipicker:$version in build.gradle della tua app .

    dependencies {
        implementation "androidx.emoji2:emojipicker:$version"
    }
    
  2. Aumenta la visualizzazione del selettore di emoji e, facoltativamente, imposta emojiGridRows e emojiGridColumns.

    • Il numero predefinito di emojiGridColumns è 9.
    • Il numero di righe viene calcolato in base all'altezza della vista principale e al valore emojiGridColumns.
    • Utilizza un valore in virgola mobile per emojiGridRows per indicare che l'utente può scorri verso il basso per visualizzare altre emoji.
    <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. Usa setOnEmojiPickedListener() per aggiungere le emoji selezionate a una visualizzazione. Ad esempio, per aggiungere un elemento a EditText, segui questi passaggi:

    emojiPickerView.setOnEmojiPickedListener {
        findViewById<EditText>(R.id.edit_text).append(it.emoji)
    }
    
  4. (Facoltativo) Imposta RecentEmojiProvider; vedi app di esempio per un esempio implementazione.

  5. Se vuoi, puoi personalizzare gli stili. Crea il tuo stile per sostituire il tema comune e applicare lo stile all'elemento EmojiPickerView. Ad esempio: L'override di colorControlNormal modifica il colore dell'icona della categoria.

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

App di esempio

L'app di esempio del selettore di emoji illustra alcuni casi d'uso di base, i seguenti scenari aggiuntivi:

  • Ricalcolo del layout quando emojiGridRows o emojiGridColumns vengono reimpostati.
  • Un fornitore recente di emoji sostituito che ordina per frequenza.
  • Personalizzazione aggiuntiva dello stile.