Seletor de emojis

O seletor de emojis é uma solução de interface que oferece uma aparência moderna e moderna. emojis e facilidade de uso. Os usuários podem procurar e selecionar emojis e as variantes deles ou escolher entre os emojis usados recentemente.

Figura 1. Seletor de emojis

Com essa biblioteca, os aplicativos de diversas fontes podem proporcionar um ambiente uma experiência unificada de emojis para os usuários, sem que os desenvolvedores precisem criar e manter seu próprio seletor de emojis do zero.

Recursos

O seletor de emojis tem os recursos abaixo.

Emojis atualizados

Os emojis recém-lançados são incluídos seletivamente no seletor de emojis. O emoji A biblioteca do seletor é compatível com várias versões e dispositivos do Android.

Variantes fixas

Toque e pressione um emoji para mostrar um menu de variantes, como diferentes gêneros ou tons de pele. A variante escolhida é salva no seletor de emojis, e a última variante selecionada é usada no painel principal.

Com esse recurso, os usuários podem enviar as variantes preferidas de emojis com apenas um toque.

variantes de emoji
Figura 2. Variantes de emoji.

Emoji recente

emoji recente
Figura 3. Emoji recente.

O RecentEmojiProvider é responsável por fornecer emojis na categoria Uso recente. A biblioteca tem um provedor de emojis recente padrão que satisfaça o caso de uso mais comum:

  • Todos os emojis selecionados são salvos por app nas preferências compartilhadas.
  • O seletor mostra no máximo três linhas dos emojis selecionados, com duplicação eliminada, ao contrário. ordem cronológica.

Se esse comportamento padrão for suficiente, não será necessário usar setRecentEmojiProvider().

No entanto, talvez seja necessário personalizar o comportamento do provedor. Confira algumas práticas cenários:

  • Você quer armazenar emojis selecionados diferentes por conta de usuário.
  • Você quer usar o armazenamento de dados em vez das preferências compartilhadas.
  • Você quer mostrar os emojis recentes classificados por frequência.

Em seguida, você pode implementar a interface RecentEmojiProvider e defini-la usando setRecentEmojiProvider().

Seletor de direção

A partir do Emoji 15.1, o seletor de emojis oferece suporte a emojis bidirecionais. Os usuários podem tocar no seletor bidirecional para alternar entre as versões à esquerda e à direita dos emojis.

emoji bidirecional à esquerda

Figura 4. Emoji bidirecional voltado para a esquerda.

emoji bidirecional à direita

Figura 5. Emoji bidirecional voltado para a direita.

Seletor de emojis para várias pessoas

Os usuários podem tocar e pressionar os emojis para revelar opções de emojis para várias pessoas.

toque e pressione o casal de emojis

Figura 6. Toque e pressione um casal de emojis para revelar as seleções de emojis de várias pessoas.

toque no emoji de pessoa à esquerda

Figura 7. Selecione um emoji de pessoa com a metade esquerda.

tocar no emoji à direita da pessoa

Figura 8. Selecione um emoji de pessoa com a metade direita.

Quando o usuário seleciona a metade esquerda ou direita do emoji de um casal, o seletor exibe uma visualização no canto inferior direito, como mostrado nas figuras 7 e 8. Depois de selecionar as duas metades do casal de emojis, os usuários podem selecionar a visualização para compor o casal de emojis personalizado.

Compatibilidade com EmojiCompat

Se ativada, uma instância EmojiCompat é usada no seletor de emojis para renderizar o maior número possível de emojis. No entanto, o Seletor de emoji não exige EmojiCompat.

Pré-requisitos

O app precisa segmentar o Android 5.0 (nível 21 da API) ou versões mais recentes.

Usar a biblioteca

  1. Importe androidx.emoji2:emojipicker:$version no build.gradle do seu app .

    dependencies {
        implementation "androidx.emoji2:emojipicker:$version"
    }
    
  2. Infle a visualização do seletor de emojis e, opcionalmente, defina emojiGridRows e emojiGridColumns.

    • O número padrão de emojiGridColumns é 9.
    • A contagem de linhas é calculada com base na altura da visualização mãe e no valor de emojiGridColumns.
    • Use um valor flutuante para emojiGridRows para indicar que o usuário pode role a tela para conferir mais emojis.
    <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. Use setOnEmojiPickedListener() para anexar o emoji selecionado a uma visualização. Por exemplo, para anexar a um EditText, faça o seguinte:

    emojiPickerView.setOnEmojiPickedListener {
        findViewById<EditText>(R.id.edit_text).append(it.emoji)
    }
    
  4. Se quiser, defina RecentEmojiProvider. Confira o app de exemplo para conferir um exemplo implementação.

  5. Personalizar estilos, se quiser. Crie seu próprio estilo para substituir o tema comum. atributos e aplique o estilo à EmojiPickerView. Por exemplo, modificar colorControlNormal muda a cor do ícone da 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 de exemplo

O app de exemplo Emoji Picker demonstra casos de uso básicos, além de os seguintes cenários adicionais:

  • Recálculo de layout quando emojiGridRows ou emojiGridColumns são redefinidos.
  • Um provedor de emoji recente substituído que classifica por frequência.
  • Personalização de estilo adicional.