跳到主要内容

逐条消息已读功能

提示

IMKit 逐条消息已读功能（消息已读 V5）自 SDK 5.30.0 版本起支持。

IMKit 内置页面中已默认实现逐条消息已读功能。当接收端查看到某条消息时，会发送这条消息的已读回执，发送端则会收到这条消息的已读回执回调，同时刷新消息已读标记图标，例如绿色的对勾图标。

逐条消息已读回执发送逻辑：进入单群聊会话页面后，当某条接收的消息在屏幕中展示后，才会触发这条消息的已读回执的发送。

准备工作​

使用本功能前，必须先提交工单开通逐条消息已读功能。功能开通后，单群聊已读回执功能将失效。

已读回执显示开关​

逐条消息已读功能开通后，IMKit 客户端的回执显示功能默认开启，在单聊和群聊中默认会展示消息回执。

您可以修改支持的会话类型。可以将逐条已读回执显示配置为仅在单聊中支持，群聊中将不显示逐条已读回执，传空表示关闭逐条已读回执显示。

Objective C
RCKitConfigCenter.message.enabledReadReceiptConversationTypeList = @[ @(ConversationType_PRIVATE) ];

单聊已读回执​

在单聊会话中，发送方会实时收到消息的已读状态更新。在 IMKit 内置页面中，单聊已读状态显示在两处：

  1. 会话列表页面：会话列表的每条会话会显示会话中的最后一条消息的预览。如果单聊会话最后一条消息是自己发送的消息，那么会展示已读回执状态的图标。

    • 如果最后一条消息未被对方阅读，默认展示灰色的圆圈图标。
    • 如果最后一条消息被对方阅读，默认展示绿色的对勾图标。

  2. 消息列表页面：在发送方的单聊会话页面，消息的左下角会显示对号，表示对方已读，如果展示灰圈，则表示对方未读。

会话列表页面
图 1：会话列表页面
消息列表页面
图 2：消息列表页面

群聊已读回执​

在群聊会话中，发送方会实时收到消息的已读状态更新。在 IMKit 内置页面中，群聊已读状态显示在消息列表页面，消息的左下角会显示消息已读状态。

消息阅读情况说明：

  • 无人阅读时，显示灰色圆圈；
  • 部分人阅读时，显示绿色饼状图，代表已读人数与总人数的占比情况；
  • 所有人已读时，显示绿色对钩。

已读回执详情页面​

点击消息左下角已读状态按钮，即可进入已读回执详情页面。单聊会话页面不可点击。

以下是已读回执详情页面相关组件的详细说明：

  • RCReadReceiptUserListViewController: 已读回执详情页面，负责展示已读回执详情。
  • RCReadReceiptUserListViewModel: 已读回执详情页面数据模型，负责管理已读回执详情数据。

自定义已读回执按钮点击事件​

在继承 RCConversationViewController 的子类中，重写 didTapReceiptStatusView: 方法来自定义点击事件。

Objective C
- (void)didTapReceiptStatusView:(RCMessageModel *)model {
    // 初始化 viewModel
    RCMessageReadDetailViewModel *viewModel = [[RCMessageReadDetailViewModel alloc] initWithMessageModel:model config:nil];
    // 初始化已读回执详情页面
    RCMessageReadDetailViewController *vc = [[RCMessageReadDetailViewController alloc] initWithViewModel:viewModel];
    // 设置数据源代码（可自定义 headerView 的显示）
    vc.dataSource = self;
    // 进入已读回执详情页面
    [self.navigationController pushViewController:vc animated:YES];
}

页面定制化​

在自定义按钮点击事件 didTapReceiptStatusView: 方法中，设置 RCMessageReadDetailViewController 的 dataSource 。

实现协议方法 viewController:headerViewWithMessage: 返回自定义的顶部视图。

自定义页面顶部视图​

示例代码如下：

Objective C
// 实现这个代码方法，返回已读回执详情页面的头视图
- (UIView *)viewController:(RCMessageReadDetailViewController *)viewController headerViewWithMessage:(RCMessageModel *)messageModel {
    RCDReceiptDetailsMessageView *view = [[RCDReceiptDetailsMessageView alloc] init];
    view.message = messageModel;
    return view;
}

效果如下：

最后于 更新