Bộ chọn biểu tượng cảm xúc là một giải pháp giao diện người dùng mang đến giao diện hiện đại, biểu tượng cảm xúc mới nhất và dễ sử dụng. Người dùng có thể duyệt qua và chọn biểu tượng cảm xúc cũng như các biến thể của chúng hoặc chọn trong số các biểu tượng cảm xúc sử dụng gần đây.
Với thư viện này, các ứng dụng từ nhiều nguồn có thể mang đến trải nghiệm biểu tượng cảm xúc thống nhất và toàn diện cho người dùng mà không cần nhà phát triển phải tạo và duy trì bộ chọn biểu tượng cảm xúc của riêng họ từ đầu.
Tính năng
Biểu tượng cảm xúc mới nhất
Các biểu tượng cảm xúc mới phát hành được đưa vào một cách có chọn lọc trong Bộ chọn biểu tượng cảm xúc. Thư viện Bộ chọn biểu tượng cảm xúc tương thích trên nhiều phiên bản và thiết bị Android.
Biến thể cố định
Nhấn và giữ một biểu tượng cảm xúc để hiện trình đơn gồm các biến thể, chẳng hạn như giới tính hoặc màu da khác nhau. Biến thể bạn chọn sẽ được lưu trong Bộ chọn biểu tượng cảm xúc và biến thể bạn chọn gần đây nhất sẽ được dùng trong bảng điều khiển chính.
Với tính năng này, người dùng có thể gửi các biến thể biểu tượng cảm xúc họ muốn chỉ bằng một lần nhấn.
Biểu tượng cảm xúc gần đây
RecentEmojiProvider
chịu trách nhiệm cung cấp biểu tượng cảm xúc trong danh mục Đã dùng gần đây. Thư viện có một trình cung cấp biểu tượng cảm xúc mặc định mới đây đáp ứng trường hợp sử dụng phổ biến nhất:
- Tất cả biểu tượng cảm xúc bạn chọn đều được lưu cho mỗi ứng dụng trong lựa chọn ưu tiên chung.
- Bộ chọn hiển thị tối đa 3 hàng biểu tượng cảm xúc đã chọn, theo thứ tự từ mới nhất đến cũ nhất (các biểu tượng trùng lặp sẽ bị loại bỏ).
Nếu hành vi mặc định này là đủ, thì bạn không cần sử dụng setRecentEmojiProvider()
.
Tuy nhiên, bạn có thể cần phải tuỳ chỉnh hành vi của nhà cung cấp. Dưới đây là một số trường hợp phổ biến:
- Bạn muốn lưu trữ nhiều biểu tượng cảm xúc đã chọn cho mỗi tài khoản người dùng.
- Bạn muốn sử dụng bộ nhớ dữ liệu ngoài lựa chọn ưu tiên chung.
- Bạn muốn hiển thị các biểu tượng cảm xúc gần đây được sắp xếp theo tần suất.
Sau đó, bạn có thể triển khai giao diện RecentEmojiProvider
và đặt giao diện này bằng setRecentEmojiProvider()
.
Khả năng tương thích với EmojiCompat
Nếu được bật, một thực thể EmojiCompat
sẽ được dùng trong Bộ chọn biểu tượng cảm xúc để hiển thị nhiều biểu tượng cảm xúc nhất có thể. Tuy nhiên, Bộ chọn biểu tượng cảm xúc không yêu cầu EmojiCompat
.
Điều kiện tiên quyết
Ứng dụng của bạn phải nhắm đến Android 5.0 (API cấp 21) trở lên.
Sử dụng thư viện
Nhập
androidx.emoji2:emojipicker:$version
vào tệpbuild.gradle
của ứng dụng.dependencies { implementation "androidx.emoji2:emojipicker:$version" }
Tăng cường chế độ xem Bộ chọn biểu tượng cảm xúc rồi đặt
emojiGridRows
vàemojiGridColumns
(không bắt buộc).- Số mặc định của
emojiGridColumns
là 9. - Số hàng được tính dựa trên chiều cao của chế độ xem gốc và giá trị của
emojiGridColumns
. - Sử dụng giá trị số thực cho
emojiGridRows
để cho biết rằng người dùng có thể cuộn xuống để xem nhiều biểu tượng cảm xúc hơn.
<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)
- Số mặc định của
Sử dụng
setOnEmojiPickedListener()
để thêm các biểu tượng cảm xúc đã chọn vào một khung hiển thị. Ví dụ: để thêm vàoEditText
, hãy làm như sau:emojiPickerView.setOnEmojiPickedListener { findViewById<EditText>(R.id.edit_text).append(it.emoji) }
Đặt
RecentEmojiProvider
(không bắt buộc), hãy xem ứng dụng mẫu để biết cách triển khai mẫu.Tuỳ chỉnh kiểu nếu muốn. Tạo kiểu của riêng bạn để ghi đè các thuộc tính giao diện phổ biến và áp dụng kiểu đó cho
EmojiPickerView
. Ví dụ: việc ghi đècolorControlNormal
sẽ thay đổi màu biểu tượng danh mục.<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" />
Ứng dụng mẫu
Ứng dụng mẫu Bộ chọn biểu tượng cảm xúc minh hoạ các trường hợp sử dụng cơ bản cùng với các trường hợp bổ sung sau đây:
- Tính toán lại bố cục khi đặt lại
emojiGridRows
hoặcemojiGridColumns
. - Một trình cung cấp biểu tượng cảm xúc gần đây đã bị thay thế và sắp xếp theo tần suất.
- Tuỳ chỉnh kiểu bổ sung.