Android 环信中实现自定义消息

Tom！！！

已于 2022-10-13 16:36:54 修改

阅读量1.2k

点赞数

文章标签： android java 开发语言

于 2022-10-13 16:36:44 首次发布

本文链接：https://blog.csdn.net/weixin_42193246/article/details/126780014

版权

很多朋友在集成环信中经常会遇到要求实现一个自定义消息。相信很多人一开始对自定义消息不是很理解!

自定义消息是什么呢？

自定义消息，即可以理解为自己定义的消息格式，消息通过自己想要展示的样式去展示。

1、首先咱们先注册一个自定义消息的对话类型。

2、新建 ChatUrlAdapterDelegate 继承 EaseMessageAdapterDelegate。

package com.hyphenate.easeim;

import android.view.View;
import android.view.ViewGroup;

import com.hyphenate.chat.EMCustomMessageBody;
import com.hyphenate.chat.EMMessage;
import com.hyphenate.easeui.delegate.EaseMessageAdapterDelegate;
import com.hyphenate.easeui.interfaces.MessageListItemClickListener;
import com.hyphenate.easeui.viewholder.EaseChatRowViewHolder;
import com.hyphenate.easeui.widget.chatrow.EaseChatRow;
public class ChatUrlAdapterDelegate extends EaseMessageAdapterDelegate<EMMessage, EaseChatRowViewHolder> {
    private MessageListItemClickListener mItemClickListener;
    @Override
    public boolean isForViewType(EMMessage item, int position) {
        if(item.getType() == EMMessage.Type.CUSTOM){
            EMCustomMessageBody messageBody = (EMCustomMessageBody) item.getBody();
            String event = messageBody.event();
            return event.equals("ease")?true:false;
        }
        return false;

        //return item.getType() == EMMessage.Type.CUSTOM && item.getBooleanAttribute(DemoConstant.URL, false);
    }

    @Override
    protected EaseChatRow getEaseChatRow(ViewGroup parent, boolean isSender) {
        return new ChatRowNew(parent.getContext(), isSender);
    }

    @Override
    protected EaseChatRowViewHolder createViewHolder(View view, MessageListItemClickListener itemClickListener) {
        return new ChatUrlViewHolder(view, itemClickListener);
    }
}

3、新建 ChatRowNew 继承 EaseChatRow 并实现相关方法

package com.hyphenate.easeim;

import android.content.Context;
import android.text.TextUtils;
import android.util.Log;
import android.widget.TextView;


import com.hyphenate.chat.EMCustomMessageBody;
import com.hyphenate.chat.EMMessage;
import com.hyphenate.chat.EMMessageBody;
import com.hyphenate.chat.EMTextMessageBody;
import com.hyphenate.easeui.widget.chatrow.EaseChatRow;


import java.util.Map;

public class ChatRowNew extends EaseChatRow {
    private TextView title;
    private TextView msg;

    public ChatRowNew(Context context, boolean isSender) {
        super(context, isSender);
    }

    @Override
    protected void onInflateView() {
        inflater.inflate(showSenderType ? R.layout.chat_url_layout : R.layout.chat_url_received_layout, this);
        Log.e("showSenderType",showSenderType+"-------");
    }

    @Override
    protected void onFindViewById() {
        title = findViewById(R.id.title);
        msg = findViewById(R.id.msg);
    }
    @Override
    protected void onSetUpView() {
        EMCustomMessageBody body = (EMCustomMessageBody) message.getBody();
        Map<String, String> params = body.getParams();
        title.setText(params.get("title"));
        msg.setText(params.get("msg"));
    }
}

布局文件chat_url_layout：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:tools="http://schemas.android.com/tools"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    android:paddingTop="13dp"
    tools:ignore="MissingDefaultResource">

    <TextView
        android:id="@+id/timestamp"
        style="@style/chat_text_date_style"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="环信"
        />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin_chat_activity" >

        <com.hyphenate.easeui.widget.EaseImageView
            android:id="@+id/iv_userhead"
            style="@style/ease_row_sent_iv_userhead_style"/>

        <RelativeLayout
            android:id="@+id/bubble"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="@dimen/margin_chat_activity"
            android:layout_toLeftOf="@id/iv_userhead"
            android:minWidth="30dp"
            android:padding="8dp"
            android:layout_marginTop="2dp"
            android:background="@drawable/ease_chat_bubble_send_bg"
            android:layout_below="@id/tv_userid">
            <LinearLayout
                android:orientation="vertical"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

                <TextView
                    android:id="@+id/title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="环信"
                    android:textColor="@color/colorAccent"
                    android:textSize="18sp"
                    android:textStyle="bold" />
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                    <TextView
                        android:id="@+id/msg"
                        android:layout_weight="1"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:text="环信自定义消息"
                        />

                </LinearLayout>
            </LinearLayout>
        </RelativeLayout>

        <ImageView
            android:id="@+id/msg_status"
            android:layout_toLeftOf="@id/bubble"
            style="@style/ease_row_sent_iv_fail_style"/>

        <TextView
            android:id="@+id/tv_ack"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toLeftOf="@id/bubble"
            android:layout_marginRight="@dimen/ease_chat_ack_margin_bubble"
            android:text="@string/text_ack_msg"
            android:textSize="12sp"
            android:visibility="invisible" />

        <TextView
            android:id="@+id/tv_delivered"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toLeftOf="@id/bubble"
            android:layout_marginRight="@dimen/ease_chat_ack_margin_bubble"
            android:text="@string/text_delivered_msg"
            android:textSize="12sp"
            android:visibility="invisible" />

        <ProgressBar
            android:id="@+id/progress_bar"
            style="?android:attr/progressBarStyle"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:indeterminateDrawable="@drawable/ease_chat_loading_progress_bar"
            android:layout_toLeftOf="@id/bubble"
            android:visibility="invisible" />

        <TextView
            android:id="@+id/tv_userid"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="@dimen/chat_nick_margin_left"
            android:textSize="@dimen/chat_nick_text_size"
            android:layout_toLeftOf="@id/iv_userhead"
            android:visibility="gone" />

    </RelativeLayout>

</LinearLayout>

布局文件chat_url_received_layout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:tools="http://schemas.android.com/tools"
    android:gravity="center_horizontal"
    android:orientation="vertical"
    android:paddingTop="13dp"
    tools:ignore="MissingDefaultResource">

    <TextView
        android:id="@+id/timestamp"
        style="@style/chat_text_date_style"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="环信"
        />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/margin_chat_activity" >

        <com.hyphenate.easeui.widget.EaseImageView
            android:id="@+id/iv_userhead"
            style="@style/ease_row_receive_iv_userhead_style" />

        <RelativeLayout
            android:id="@+id/bubble"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/margin_chat_activity"
            android:layout_toRightOf="@id/iv_userhead"
            android:minWidth="30dp"
            android:padding="8dp"
            android:layout_marginTop="2dp"
            android:background="@drawable/ease_chat_bubble_receive_bg"
            android:layout_below="@id/tv_userid">
            <LinearLayout
                android:orientation="vertical"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">
                <TextView
                    android:id="@+id/title"
                    android:textColor="@color/colorAccent"
                    android:textStyle="bold"
                    android:textSize="18sp"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"/>
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                    <TextView
                        android:id="@+id/msg"
                        android:layout_weight="1"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"/>

                </LinearLayout>
            </LinearLayout>
        </RelativeLayout>

        <ImageView
            android:id="@+id/msg_status"
            android:layout_toRightOf="@id/bubble"
            style="@style/ease_row_sent_iv_fail_style"/>

        <TextView
            android:id="@+id/tv_ack"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@id/bubble"
            android:layout_marginLeft="@dimen/ease_chat_ack_margin_bubble"
            android:text="@string/text_ack_msg"
            android:textSize="12sp"
            android:visibility="invisible" />

        <TextView
            android:id="@+id/tv_delivered"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@id/bubble"
            android:layout_marginLeft="@dimen/ease_chat_ack_margin_bubble"
            android:text="@string/text_delivered_msg"
            android:textSize="12sp"
            android:visibility="invisible" />

        <ProgressBar
            android:id="@+id/progress_bar"
            style="?android:attr/progressBarStyle"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:indeterminateDrawable="@drawable/ease_chat_loading_progress_bar"
            android:layout_toRightOf="@id/bubble"
            android:visibility="invisible" />

        <TextView
            android:id="@+id/tv_userid"
            style="@style/chat_text_name_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/chat_nick_margin_left"
            android:textSize="@dimen/chat_nick_text_size"
            android:layout_toRightOf="@id/iv_userhead"
            android:visibility="gone" />

    </RelativeLayout>

</LinearLayout>

4、新建 ChatViewHolder 继承 EaseChatRowViewHolder 并实现相关方法

package com.hyphenate.easeim;

import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;

import com.hyphenate.chat.EMCustomMessageBody;
import com.hyphenate.chat.EMMessage;
import com.hyphenate.easeui.interfaces.MessageListItemClickListener;
import com.hyphenate.easeui.viewholder.EaseChatRowViewHolder;


public class ChatViewHolder extends EaseChatRowViewHolder {
    public ChatViewHolder(@NonNull View itemView, MessageListItemClickListener itemClickListener) {
        super(itemView, itemClickListener);
    }
    public static EaseChatRowViewHolder create(ViewGroup parent,
                                               boolean isSender, MessageListItemClickListener itemClickListener) {
        return new EaseChatRowViewHolder(new ChatRowNew(parent.getContext(), isSender), itemClickListener);
    }
    @Override
    public void onBubbleClick(EMMessage message) {
        super.onBubbleClick(message);
        EMCustomMessageBody body = (EMCustomMessageBody) message.getBody();
     //   ToastUtils.showToast("url" + body.getParams().get("url"));
    }
}

5、发送消息

 EMMessage customMessage = EMMessage.createSendMessage(EMMessage.Type.CUSTOM);
// event为需要传递的自定义消息事件，比如礼物消息，可以设置event = "gift"
        EMCustomMessageBody customBody = new EMCustomMessageBody("ease");
// params类型为Map<String, String>
        Map<String,String> params = new HashMap<>();
        params.put("title","环信");
        params.put("msg","环信自定义消息");
        params.put("image","https://tse4-mm.cn.bing.net/th/id/OIP-C.nRlAFygdctTCHmIWN7GxRwHaEK?pid=ImgDet&rs=1");
        params.put("url","https://tse4-mm.cn.bing.net/th/id/OIP-C.nRlAFygdctTCHmIWN7GxRwHaEK?pid=ImgDet&rs=1");
        customBody.setParams(params);
        customMessage.addBody(customBody);
// to指另一方环信id（或者群组id，聊天室id）
        customMessage.setTo(conversationId);
        EMClient.getInstance().chatManager().sendMessage(customMessage);

android 代码就结束了，下面是简单的一个效果。布局可以自己进行修改。