融雲即時通信SDK集成 -- 定製UI(一) ——會話界面小改動

融雲即時通信SDK集成 -- 定製UI(一) ——會話界面小改動

背景:

最近公司新上的app要加上即時通信的功能, 本身快速實現一個固然是不可能的了(項目deadline也頂不住哇).就從各家成熟的SDK廠商選來選去的, 各有各的好也各有各的不足.最後點兵點將,選了融雲家的SDK(老闆說了算hhhh).
他家的官網和文檔地址:
官網：https://www.rongcloud.cn/
文檔：https://docs.rongcloud.cn/v4
這個任務固然仍是落在個人頭上. 我是使用的他們家的帶UI的sdk,(他們家有帶UI和不帶UI的兩種sdk, 不帶UI的sdk就是隻有即時通信能力, 全部的UI都須要開發者自定實現, 帶UI的sdk封裝了一些基本的界面,例如會話列表, 和別人聊天的會話界面.)固然這些已經集成了UI的sdk並不能徹底知足一個產品的需求, 因此這篇文章主要跟你們講下如何對他們家的UI進行簡單的自定義.

融雲SDK接入會話列表/會話界面

你們集成的話能夠直接按照他們家的快速集成的步驟走, 包含了集成會話列表以及會話界面. 這裏是連接: 快速集成SDK (https://docs.rongcloud.cn/v4/views/im/noui/guide/quick/include/android.html)

接入以後, 能夠按照合適的邏輯跳轉入這兩個基本的界面, 如圖所示:
會話列表:

會話界面

能夠看到咱們的app中如今擁有了默認會話列表和會話界面UI, 可使用基本的功能了. 可是這些基本的UI雖然說不上難看, 可是也夠不上精美. 因此UI這塊仍是須要咱們自行來作一些定製的.

爲了給你們演示, 我這裏改的比較誇張了一點, 十分醜陋, 但直觀哈哈哈.

如圖我直接更改了兩邊發送者&接收者的字體顏色,字體大小,字體樣式. 也更改了雙方的聊天氣泡.

修改普通文字消息類型的消息, 直接繼承了TextMessageItemProvider. 把父類裏邊全部的代碼都複製進來, 而後在bindView()的時候作修改

能夠看到我把樣式隨便改了一下. 兩個方向的氣泡都改爲了箭頭左向的.

@Override
    public void bindView(final View v, int position, TextMessage content, final UIMessage data) {
        ViewHolder holder = (ViewHolder) v.getTag();
        holder.receiverFire.setTag(data.getUId());
        if (data.getMessageDirection() == Message.MessageDirection.SEND) {
            holder.message.setBackgroundResource(R.drawable.rc_ic_bubble_right);
        } else {
            holder.message.setBackgroundResource(R.drawable.rc_ic_bubble_left);
        }
        if (content.isDestruct()) {
            bindFireView(v, position, content, data);
        } else {
            holder.sendFire.setVisibility(View.GONE);
            holder.receiverFire.setVisibility(View.GONE);
            holder.unRead.setVisibility(View.GONE);
            holder.message.setVisibility(View.VISIBLE);
            final AutoLinkTextView textView = holder.message;
            processTextView(v, position, content, data, textView);
        }
    }

作完改動, 還須要給這個類添加這樣的註解才能綁定TextMessage的渲染:

@ProviderTag(
        messageContent = TextMessage.class,
        showReadState = true
)
    public class MyTextMessageItemProvider extends TextMessageItemProvider

而後記得在init 咱們SDK以後, 註冊一下這個Provider.

RongIM.init(this, APP_KEY);
    RongIM.registerMessageTemplate(new MyTextMessageItemProvider());

這樣全部收到的類型爲TextMessage的消息, 都會按照我這裏定義的TextMessageItemProvider來作展現了. 其餘類型的消息也是同樣的, 語音, 文件, 位置消息. 只要想改UI, 本質上都是集成相應的MessageItemProvider, 而後重寫bindView()方法.