跳到主要内容

消息展示样式

Global IM UIKit 支持通过两种方式修改会话页面中消息的展示样式。

  • 通过修改 RCMessageModel 的属性,更改消息 Cell 的展示样式。
  • 会话页面中需要展示的内置消息类型(详见消息类型概述)均提供了对应的展示模板(消息 Cell)。您可以可以按需创建自定义消息 Cell,替换默认模板。
提示

如果 App 创建了自定义消息类型(详见自定义消息类型),默认没有对应的消息展示模板。如果该自定义类型的消息需要展示在会话界面中,则应用程序必须创建对应的消息 Cell,并提供给 Global IM UIKit。

修改消息 Model 属性​

会话页面 model 是 RCMessageModel。通过修改 RCMessageModel 的以下属性可以更改消息 cell 的展示样式:

属性类型说明
alignmentRCMessageCellAlignment气泡对齐方式,默认发送方是 RCMessageCellAlignmentRight,接收方是 RCMessageCellAlignmentLeft
bubbleRadiusCGFloat气泡圆角,默认 10
bubbleColorUIColor气泡颜色
displayPortraitBOOL是否显示头像,默认只有群聊的接收方显示头像
displayNameBOOL是否显示名字,默认只有群聊的接收方显示名字

重写 RCChatViewController 的下面方法修改 RCMessageModel 的配置项:

Objective C
- (void)listView:(RCMessageListView *)listView willLoadCell:(nonnull UITableViewCell *)cell forMessageModel:(nonnull RCMessageModel *)messageModel {
messageModel.displayName = [TestKitConfigManager shared].displayGroupSelfName;
messageModel.displayPortrait = [TestKitConfigManager shared].displayGroupSelfPortrait;
messageModel.alignment = [TestKitConfigManager shared].alignment;
messageModel.bubbleRadius = [TestKitConfigManager shared].bubbleRadius;
messageModel.bubbleColor = HEXCOLOR(0x1BC953);
}

自定义消息展示模板​

Global IM UIKit 通过「消息展示模板」控制会话页面中消息的展示样式,Global IM UIKit 中所有消息模板都继承自 RCMessageCell。App 可以按需修改指定类型消息的展示模板,实现对消息展示样式的个性化配置。

  • SDK 默认为会话页面中需要展示的内置消息类型(详见消息类型概述)提供了展示模板,App 可以按需创建模板,替换默认模板。
  • App 创建的自定义消息类型(详见自定义消息类型)默认没有对应的消息展示模板。如果 App 需要在会话界面中展示该自定义类型的消息,则必须创建对应的消息展示模板,提供给 SDK。否则 SDK 无法正常展示该类型消息。

如果您需要更改 SDK 内置消息的展示效果,且自定义需求较高,可以继承 RCMessageCell,创建新的消息展示模板,并将该自定义模板提供给 SDK,替换 SDK 默认模板。

Global IM UIKit 中会话页面中所有消息 Cell 继承自 RCMessageCell。您可以创建自定义消息 Cell,用于控制消息在会话页面的展示形式。自定义 Cell 可继承 RCMessageCell 或 RCMessageBaseCell。

继承 RCMessageBaseCell​

RCMessageBaseCell 是 RCMessageCell 的父类,不支持显示头像和昵称。

RCMessageBaseCell 结构图:

如果继承 RCMessageBaseCell,请在初始化 Cell 时将在 baseContentView 上添加自定义控件。

继承 RCMessageCell​

RCMessageCell 继承自 RCMessageBaseCell,增加了显示头像和昵称的特性。

如果继承 RCMessageCell,请在初始化 Cell 时将在 messageContentView 上添加自定义控件。消息 cell 是自适应高度,所以只需要设置好自定义控件的 size。

设置视图布局和数据​

重写 RCMessageCell 或 RCMessageBaseCell 的设置 Cell 的视图布局和数据。

Objective C
- (void)configure:(RCMessageModel *)messageModel {
[super configure:messageModel];
// 修改布局与数据
}

以 Global IM UIKit 的 RCFileMessageCell 中的 configure: 方法为例:

Objective C
- (void)configure:(RCMessageModel *)model {
[super configure:model];
RCFileMessage *fileMessage = (RCFileMessage *)self.model.content;
self.nameLabel.text = fileMessage.name;
self.sizeLabel.text = [RCKitUtility getReadableStringForFileSize:fileMessage.size];
self.typeIconView.image = [RCKitUtility imageWithFileSuffix:fileMessage.type];
[self setAutoLayout];
}

注册消息 Cell 并绑定消息类型​

您需要向 Global IM UIKit 注册自定义的消息 Cell,同时与消息类型绑定。被绑定的消息类型可以是内置消息类型,或者应用开发者创建的自定义消息类型。如果绑定内置消息类型,则会替换默认的消息 Cell。

关于如何创建自定义消息类型,详见创建自定义消息与注册自定义消息。如果您创建了自定义消息类型且需要展示在会话界面中,必须创建对应的消息展示模板,否则 SDK 无法正常展示该类型消息。

Objective C
[self registerClass:[TestMessageCell class] forMessageClass:[TestMessage class]];