Seletor de emojis

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

Com essa biblioteca, apps de várias fontes podem oferecer uma experiência de emojis inclusiva e unificada aos usuários sem que os desenvolvedores precisem criar e manter o próprio seletor de emojis do zero.

Recursos

O Emoji Picker tem os seguintes recursos:

Emojis atualizados

Os emojis recém-lançados são incluídos seletivamente no seletor de emojis. A biblioteca Emoji Picker é 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 de emoji preferidas com um toque.

Emojis recentes

O RecentEmojiProvider é responsável por fornecer emojis na categoria Uso recente. A biblioteca tem um provedor de emoji recente padrão que atende ao 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 de emojis selecionados, sem duplicações, em ordem cronológica inversa.

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 alguns cenários comuns:

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

Em seguida, implemente a interface RecentEmojiProvider e defina-a 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 versões à esquerda e à direita do emoji.

Figura 4. Emoji bidirecional virado para a esquerda.

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.

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

Figura 7. Selecione a metade esquerda do emoji.

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

Quando o usuário seleciona a metade esquerda ou direita de um casal de emoji, o seletor mostra 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

Seu app precisa ser direcionado ao Android 5.0 (nível 21 da API) ou versões mais recentes.

Usar a biblioteca

1. Importe androidx.emoji2:emojipicker:$version no arquivo build.gradle do 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 a fim de indicar que o usuário pode rolar a tela para encontrar 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. Opcionalmente, defina RecentEmojiProvider. Consulte o app de exemplo para conferir um exemplo de implementação.

5. Personalizar estilos, se quiser. Crie seu próprio estilo para substituir atributos de tema comuns e aplique o estilo ao 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 do seletor de emojis demonstra casos de uso básicos, além dos seguintes cenários:

• 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.