在im項目(Android)中,用戶發消息,喜歡在文字中嵌入壹些小表情,以表達發送者當時的情感。除了系統輸入法自帶的emoji表情(emoji其實是特殊的文字)外。項目希望帶壹些更漂亮,帶產品特色文化的自定義小表情(小圖片)。
圖片嵌入在文字中顯示,很明顯可以使用ImageSpan去實現該效果。
效果如圖:
實現上,主要問題是,實現文字與表情的轉換。因此需要定義壹套對應關系。
這裏采用類似微信的實現,[key]對應表情。比如: [微笑] 對應 ?。
工具類:
主要就是做壹個轉換功能。同時需要考慮壹下性能優化,否則效率低就會卡頓。
PS:這裏優化了 查詢轉換策略 和 Drawable復用策略,供參考。
註 :Spannable有關的操作,少用String。使用CharSequence,因為不壹定是String。用 SpannableString.valueOf(text) 代替 new SpannableString(text)
在TextView上使用,也寫個BindingAdapter方法。
註:其中 TextUtils.ellipsize(emo, paint, avail, TextUtils.TruncateAt.END) 是為了解決表情在單行textView顯示不下時顯“...”.的問題。直接默認用TextView的 ellipsize 屬性,對表情(ImageSpan)無效,會截成半個。
表情要在輸入框中顯示。根據輸入code,自動轉換成表情(ImageSpan)。
方案1:給EditView設置監聽,在文字變化後將文字做個轉換。這樣效率超低,輸入越多越卡。否決!
方案2:根據具體變化的文本設置轉換。
註 :當前輸入的東西(可能是復制過來的多個字符)。可能會影響到前面或後面的幾個字符。
表情選擇框操作 :
刪除:模擬退格,表情需要整個整個刪。
插入:將code插入到光標末尾。
轉發到微信,有些表情微信裏沒有對應。轉換成emoji代替。
要點: