Pemilih Emoji

Pemilih Emoji adalah solusi UI yang menawarkan tampilan dan nuansa modern, emoji terbaru, dan kemudahan penggunaan. Pengguna dapat menjelajahi dan memilih emoji serta variasinya atau memilih dari emoji yang baru saja digunakan.

Gambar 1. Pemilih Emoji

Dengan library ini, aplikasi dari berbagai sumber dapat memberikan pengalaman emoji yang inklusif dan terpadu kepada penggunanya tanpa developer harus membuat dan memelihara pemilih emoji mereka sendiri dari awal.

Fitur

Pemilih Emoji memiliki fitur berikut.

Emoji terbaru

Emoji yang baru dirilis disertakan secara selektif dalam Pemilih Emoji. Library Pemilih Emoji kompatibel di berbagai versi dan perangkat Android.

Varian melekat

Tekan lama emoji untuk menampilkan menu varian, seperti gender atau warna kulit yang berbeda. Varian yang Anda pilih akan disimpan di Pemilih Emoji, dan varian terakhir yang dipilih akan digunakan di panel utama.

Dengan fitur ini, pengguna dapat mengirim varian emoji pilihan mereka dengan sekali ketuk.

varian emoji
Gambar 2. Varian emoji.

Emoji terbaru

emoji terbaru
Gambar 3. Emoji terbaru.

RecentEmojiProvider bertanggung jawab menyediakan emoji dalam kategori Baru Saja Digunakan. Library memiliki penyedia emoji terbaru default yang memenuhi kasus penggunaan paling umum:

  • Semua emoji yang dipilih disimpan per aplikasi dalam preferensi bersama.
  • Pemilih menampilkan maksimal tiga baris emoji yang dipilih, menghapus duplikatnya, dalam urutan kronologis terbalik.

Jika perilaku default ini sudah cukup, Anda tidak perlu menggunakan setRecentEmojiProvider().

Namun, Anda mungkin perlu menyesuaikan perilaku penyedia. Berikut beberapa skenario umum:

  • Anda ingin menyimpan emoji yang dipilih berbeda-beda untuk setiap akun pengguna.
  • Anda ingin menggunakan penyimpanan data selain preferensi bersama.
  • Anda ingin menampilkan emoji terbaru yang diurutkan berdasarkan frekuensi.

Kemudian, Anda dapat menerapkan antarmuka RecentEmojiProvider dan menyetelnya menggunakan setRecentEmojiProvider().

Pemilih arah

Mulai dari Emoji 15.1, Pemilih Emoji mendukung emoji dua arah. Pengguna dapat mengetuk pengalih dua arah untuk beralih antara versi emoji yang menghadap ke kiri dan kanan.

emoji kiri dua arah

Gambar 4. Emoji dua arah menghadap ke kiri.

emoji kanan dua arah

Gambar 5. Emoji dua arah menghadap ke kanan.

Pemilih emoji multi-orang

Pengguna dapat menyentuh lama pasangan emoji untuk menampilkan pilihan emoji multi-orang.

emoji pasangan sentuh lama

Gambar 6. Sentuh lama pasangan emoji untuk menampilkan pilihan emoji multi-orang.

ketuk orang emoji kiri

Gambar 7. Pilih orang emoji setengah kiri.

ketuk orang emoji kanan

Gambar 8. Pilih orang emoji setengah kanan.

Saat pengguna memilih orang emoji setengah kiri atau kanan dari pasangan emoji, pemilih akan menampilkan pratinjau di kanan bawah, seperti yang ditunjukkan pada gambar 7 dan 8. Setelah memilih kedua bagian pasangan emoji, pengguna dapat memilih pratinjau untuk menyusun pasangan emoji kustom.

Kompatibilitas dengan EmojiCompat

Jika diaktifkan, instance EmojiCompat digunakan di Pemilih Emoji untuk merender sebanyak mungkin emoji. Namun, Pemilih Emoji tidak memerlukan EmojiCompat.

Prasyarat

Aplikasi Anda harus menargetkan Android 5.0 (level API 21) atau yang lebih tinggi.

Menggunakan library

  1. Impor androidx.emoji2:emojipicker:$version di file build.gradle aplikasi Anda.

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

  2. Perluas tampilan Pemilih Emoji, dan tetapkan emojiGridRows dan emojiGridColumns secara opsional.

    • Jumlah default emojiGridColumns adalah 9.
    • Jumlah baris dihitung berdasarkan tinggi tampilan induk dan nilai emojiGridColumns.
    • Gunakan nilai float untuk emojiGridRows guna menunjukkan bahwa pengguna dapat men-scroll untuk melihat emoji lainnya.
    <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. Gunakan setOnEmojiPickedListener() untuk menambahkan emoji yang dipilih ke tampilan. Misalnya, untuk menambahkan ke EditText, lakukan hal berikut:

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

  4. Tetapkan RecentEmojiProvider secara opsional, lihat contoh aplikasi untuk contoh implementasi.

  5. Sesuaikan gaya secara opsional. Buat gaya Anda sendiri untuk mengganti atribut tema umum dan menerapkan gaya ke EmojiPickerView. Misalnya, mengganti colorControlNormal akan mengubah warna ikon kategori.

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

Aplikasi Contoh

Aplikasi contoh Pemilih Emoji menunjukkan kasus penggunaan dasar beserta skenario tambahan berikut:

  • Penghitungan ulang tata letak saat emojiGridRows atau emojiGridColumns direset.
  • Penyedia emoji terbaru yang diganti dan mengurutkan berdasarkan frekuensi.
  • Penyesuaian gaya tambahan.