Skip to content

Commit

Permalink
Merge pull request #973 from haoxiuwen/doc-v2
Browse files Browse the repository at this point in the history
Modify UIKit Docs
  • Loading branch information
haoxiuwen authored Oct 8, 2024
2 parents 555cc76 + 0dc3d7e commit 9fc7c27
Show file tree
Hide file tree
Showing 8 changed files with 43 additions and 23 deletions.
17 changes: 6 additions & 11 deletions docs/.vuepress/sidebar/uikit.ts
Original file line number Diff line number Diff line change
Expand Up @@ -53,18 +53,13 @@ const chatUikitSidebar = [
collapsible: true,
children: [
{ text: '主题', link: 'chatuikit_theme.html' },
{ text: '会话列表', link: 'chatuikit_custom_conversation_list.html' },
{ text: '消息', link: 'chatuikit_custom_chat.html' },
{ text: '通讯录', link: 'chatuikit_custom_contact_list.html' },
{ text: '联系人详情', link: 'chatuikit_custom_contact_details.html' },
{ text: '群详情', link: 'chatuikit_custom_group_details.html' },
{ text: '通用可配项', link: 'chatuikit_config_item.html' },
{ text: '进阶用法', link: 'chatuikit_advancedusage.html' },
{ text: '界面自定义',
collapsible: true,
children: [
{ text: '会话列表', link: 'chatuikit_custom_conversation_list.html' },
{ text: '消息', link: 'chatuikit_custom_chat.html' },
{ text: '联系人列表', link: 'chatuikit_custom_contact_list.html' },
{ text: '联系人详情', link: 'chatuikit_custom_contact_details.html' },
{ text: '群详情', link: 'chatuikit_custom_group_details.html' },
{ text: '通用可配项', link: 'chatuikit_config_item.html' }
],
},
{ text: '页面 ViewModel 中可重载方法', link: 'chatuikit_listener.html' },
{ text: '拦截主要页面点击跳转事件', link: 'chatuikit_customize_clickjump.html' },
],
Expand Down
2 changes: 1 addition & 1 deletion docs/uikit/chatuikit/android/chatuikit_chat.md
Original file line number Diff line number Diff line change
Expand Up @@ -432,7 +432,7 @@ binding?.let {

聊天页面、会话列表页面、联系人列表页面、群详情页面和联系人详情页面的标题栏均使用 `EaseTitleBar`。如果聊天页面的标题栏不满足需求,建议自定义标题栏。关于标题栏中的标题、头像、背景色、标题栏右侧按钮的显示图片和左侧的头像,详见[设置会话列表页面的标题栏](chatuikit_custom_conversation_list.html#设置标题栏)

### 消息列表项
### 设置消息列表项

#### 设置消息列表控件功能

Expand Down
2 changes: 1 addition & 1 deletion docs/uikit/chatuikit/android/chatuikit_conversation.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@

- 点击搜索按钮,跳转到搜索页面,搜索会话。
- 点击会话列表项,跳转到会话详情页面。
- 点击导航栏的扩展按钮,选择新会话,创建新会话。
- 点击标题栏的扩展按钮,选择新会话,创建新会话。
- 长按会话列表项显示菜单,可进行删除会话、置顶会话、消息免打扰操作。

单条会话展示会话名称、最后一条消息、最后一条消息的时间以及置顶和禁言状态等。
Expand Down
11 changes: 10 additions & 1 deletion docs/uikit/chatuikit/ios/chatuikit_custom_chat.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,13 @@
# 设置聊天页面
# 聊天消息

环信单群聊 UIKit 的聊天页面提供如下功能:

- 发送和接收消息, 包括文本、表情、图片、语音、视频、文件和名片消息。
- 对消息进行复制、引用、撤回、删除、编辑、重新发送和审核。
- 从服务器拉取漫游消息。
- 清除本地消息。

消息相关功能,详见[功能介绍文档](chatfeature_message.html)

你可以配置聊天页面的导航栏、消息列表项、输入框和跳转事件等。详见 [MessageListController.swift](https://github.com/easemob/easemob-uikit-ios/blob/main/Sources/EaseChatUIKit/Classes/UI/Components/Chat/Controllers/MessageListController.swift)

Expand Down
4 changes: 2 additions & 2 deletions docs/uikit/chatuikit/ios/chatuikit_custom_contact_details.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
# 设置联系人详情页面

你可以配置联系人详情页面的头部导航栏、点击右侧图片显示的联系人操作和联系人详情自定义列表项等。详见 [ContactInfoViewController](https://github.com/easemob/easemob-uikit-ios/tree/main/Documentation/EaseChatUIKit.doccarchive/documentation/easechatuikit/contactinfoviewcontroller)
你可以配置联系人详情页面的导航栏、点击右侧图片显示的联系人操作和联系人详情自定义列表项等。详见 [ContactInfoViewController](https://github.com/easemob/easemob-uikit-ios/tree/main/Documentation/EaseChatUIKit.doccarchive/documentation/easechatuikit/contactinfoviewcontroller)

![img](/images/uikit/chatuikit/ios/custom_contact_details.png)

## 自定义导航栏

联系人详情页面、聊天页面、会话列表页面、联系人列表页面和群详情页面的导航栏均使用 `EaseChatNavigationBar`。如果联系人详情页面的导航栏不满足需求,建议自定义导航栏,重载方法传入自定义的导航类。关于导航栏中的标题、头像、背景色、导航栏右侧按钮的显示图片和左侧的头像,详见[自定义会话列表页面的导航栏](chatuikit_custom_conversation_list.html#自定义头部导航栏)
联系人详情页面、聊天页面、会话列表页面、联系人列表页面和群详情页面的导航栏均使用 `EaseChatNavigationBar`。如果联系人详情页面的导航栏不满足需求,建议自定义导航栏,重载方法传入自定义的导航类。关于导航栏中的标题、头像、背景色、导航栏右侧按钮的显示图片和左侧的头像,详见[自定义会话列表页面的导航栏](chatuikit_custom_conversation_list.html#自定义导航栏)

### 设置点击右侧图片显示的联系人操作

Expand Down
10 changes: 6 additions & 4 deletions docs/uikit/chatuikit/ios/chatuikit_custom_contact_list.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
# 设置联系人列表页面
# 通讯录

你可以自定义联系人列表页面的头部导航栏、联系人列表 Header、联系人列表和联系人列表项。详见[ContactViewController](https://github.com/easemob/easemob-uikit-ios/tree/main/Documentation/EaseChatUIKit.doccarchive/documentation/easechatuikit/contactviewcontroller)
通讯录页面提供联系人搜索,添加联系人,好友申请列表入口,群组列表入口,联系人列表。

你可以自定义联系人列表页面的导航栏、联系人列表 Header、联系人列表和联系人列表项。详见[ContactViewController](https://github.com/easemob/easemob-uikit-ios/tree/main/Documentation/EaseChatUIKit.doccarchive/documentation/easechatuikit/contactviewcontroller)

![img](/images/uikit/chatuikit/ios/custom_contact_list.png)

## 自定义头部导航栏
## 自定义导航栏

联系人列表页面、聊天页面、会话列表页面、群详情页面和联系人详情页面的导航栏均使用 `EaseChatNavigationBar`。如果联系人列表页面(`ContactViewController.swift`)的导航栏不满足需求,建议自定义导航栏,重载方法传入自定义的导航类。关于头部导航栏中的标题、头像、背景色、导航栏右侧按钮的显示图片和左侧的头像,详见[自定义会话列表页面的头部导航栏](chatuikit_custom_conversation_list.html#自定义头部导航栏)
联系人列表页面、聊天页面、会话列表页面、群详情页面和联系人详情页面的导航栏均使用 `EaseChatNavigationBar`。如果联系人列表页面(`ContactViewController.swift`)的导航栏不满足需求,建议自定义导航栏,重载方法传入自定义的导航类。关于导航栏中的标题、头像、背景色、导航栏右侧按钮的显示图片和左侧的头像,详见[自定义会话列表页面的导航栏](chatuikit_custom_conversation_list.html#自定义导航栏)

## 自定义联系人列表 Header

Expand Down
20 changes: 17 additions & 3 deletions docs/uikit/chatuikit/ios/chatuikit_custom_conversation_list.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,20 @@
# 设置会话列表页面
# 会话列表

你可以配置会话列表页面的头部导航栏、会话列表项。详见 [ConversationListController.swift](https://github.com/easemob/easemob-uikit-ios/blob/main/Sources/EaseChatUIKit/Classes/UI/Components/Conversation/Controllers/ConversationListController.swift)
会话列表页面用于展示当前用户的所有会话,包含单聊和群组聊天(不包括聊天室),并且提供会话搜索、删除、置顶和免打扰功能。

- 点击搜索按钮,跳转到搜索页面,搜索会话。
- 点击会话列表项,跳转到会话详情页面。
- 点击导航栏的扩展按钮,选择新会话,创建新会话。
- 左滑、右滑或长按会话触发会话拓展功能菜单,可进行删除会话、置顶会话、消息免打扰操作。

单条会话展示会话名称、最后一条消息、最后一条消息的时间以及置顶和禁言状态等。

- 对于单聊, 会话展示的名称为对端用户的昵称,若对端用户未设置昵称则展示对方的用户 ID;会话头像是对方的头像,如果没有设置则使用默认头像。
- 对于群聊,会话名称为当前群组的名称,头像为默认头像。

会话列表相关功能,详见[功能介绍文档](chatfeature_conversation.html)

你可以配置会话列表页面的导航栏、会话列表项。详见 [ConversationListController.swift](https://github.com/easemob/easemob-uikit-ios/blob/main/Sources/EaseChatUIKit/Classes/UI/Components/Conversation/Controllers/ConversationListController.swift)

![img](/images/uikit/chatuikit/ios/custom_conversation_list.png)

Expand All @@ -17,7 +31,7 @@
}
```

会话列表页面的头部导航栏包含左、中、右三个区域,本节介绍如何配置这些区域。
会话列表页面的导航栏包含左、中、右三个区域,本节介绍如何配置这些区域。

### 设置导航栏编辑模式

Expand Down
Binary file removed docs/uikit/chatuikit/ios/custom_chat.png
Binary file not shown.

0 comments on commit 9fc7c27

Please sign in to comment.