表情符號挑選器

表情符號挑選器是一種 UI 解決方案,具有現代化外觀與風格、最新的表情符號和易用性。使用者可以瀏覽及選取表情符號及其變化版本,或選擇最近使用的表情符號。

圖 1.表情符號挑選器

有了這個程式庫,來自各種來源的應用程式就能為使用者提供多元包容的統一表情符號體驗,開發人員不必從頭開始建構及維護自己的表情符號挑選器。

功能

最新的表情符號

新發布的表情符號是選擇性的表情符號挑選器。表情符號挑選器程式庫與多種 Android 版本和裝置相容。

固定式變化版本

長按表情符號即可顯示變化版本選單,例如不同性別或膚色。您選擇的變化版本會儲存在表情符號挑選器中,最後選取的變化版本將用於主要面板。

透過這項功能,使用者輕觸一下即可傳送偏好的表情符號變化版本。

表情符號變化版本
圖 2.表情符號變化版本

最近使用的表情符號

最近的表情符號
圖 3.最近使用的表情符號

RecentEmojiProvider 負責在「最近使用」類別中提供表情符號。這個程式庫具有符合最常見的用途的預設近期表情符號提供者:

  • 所有選取的表情符號都會儲存在每個應用程式的共用偏好設定中。
  • 挑選器會顯示最多 3 列重複選取的表情符號,依時間順序由新至舊顯示。

如果這個預設行為已足夠,您就不需要使用 setRecentEmojiProvider()

不過,您可能需要自訂提供者行為。以下是一些常見的情境:

  • 您想為每個使用者帳戶儲存不同的表情符號。
  • 您想使用共用偏好設定以外的資料儲存空間。
  • 你想依頻率排序顯示最近的表情符號。

然後,您可以實作 RecentEmojiProvider 介面,並使用 setRecentEmojiProvider() 進行設定。

與「EmojiCompat」的相容性

如果啟用,表情符號挑選器會使用 EmojiCompat 例項,盡可能轉譯更多表情符號。不過,表情符號挑選器不需要使用 EmojiCompat

必要條件

您的應用程式必須指定 Android 5.0 (API 級別 21) 以上版本。

使用程式庫

  1. 在應用程式的 build.gradle 檔案中匯入 androidx.emoji2:emojipicker:$version

    dependencies {
        implementation "androidx.emoji2:emojipicker:$version"
    }
    
  2. 加載表情符號挑選器檢視畫面,並可選擇設定 emojiGridRowsemojiGridColumns

    • emojiGridColumns 的預設數量為 9。
    • 資料列數是根據父項檢視畫面高度和 emojiGridColumns 值計算而得。
    • 針對 emojiGridRows 使用浮點值,表示使用者可以向下捲動來查看更多表情符號。
    <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. 使用 setOnEmojiPickedListener() 將所選表情符號附加至檢視區塊。舉例來說,如要附加至 EditText,請按照下列步驟操作:

    emojiPickerView.setOnEmojiPickedListener {
        findViewById<EditText>(R.id.edit_text).append(it.emoji)
    }
    
  4. 您可以選擇設定 RecentEmojiProvider,請參閱範例應用程式,瞭解實作範例。

  5. 您可以選擇自訂樣式。建立自己的樣式以覆寫常見主題屬性,並將樣式套用至 EmojiPickerView。舉例來說,覆寫 colorControlNormal 會變更類別圖示的顏色。

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

範例應用程式

表情符號挑選器範例應用程式示範基本用途,以及下列額外情境:

  • 重設 emojiGridRowsemojiGridColumns 時的版面配置重新計算。
  • 最近覆寫的表情符號提供者,依頻率排序。
  • 可自訂更多樣式。