Flutter

最近更新时间：2024-05-16 12:44:11
我的收藏
本页目录：

TUIKit 介绍
TUIKit 是基于 腾讯云 IM SDK 开发的一款即时通讯 UI 组件库，包括会话、聊天、搜索、关系链、群组、音视频通话等能力。通过 TUIKit，可快速通过一套代码一次开发，集成包含 UI 界面的移动及桌面全平台即时通讯应用。
TUIKit 简化了基于 腾讯云 IM SDK 的应用开发过程。它不仅能助您快速实现 UI 功能，也支持调用 腾讯云 IM SDK 相应的接口实现即时通讯业务逻辑和数据处理。因此，您在使用 TUIKit 时仅需关注自身业务或个性化扩展。
?
?
?
支持平台
说明：
TUIKit 拥有自适应 UI 界面，可同时用于 移动端 及 桌面端。并支持以下所有平台，针对不同平台有不同的特色能力。
方便您一套代码开发全平台应用。
?iOS / Android / Web (二维码) / macOS / Windows / 混合开发（将 Flutter IM SDK 添加至现有原生应用）
单击跳转至对应平台 Demo 下载体验。以上各端 Demo 均由同一项目代码引入 TUIKit 开发编译打包而成。
TUIKit 主要功能组件介绍
TUIKit 按照功能主要分为 聊天、会话列表、关系链管理、用户或群组资料、搜索、音视频通话 等多个类型的 UI 组件，每个类型的 UI 组件负责承载不同的功能模块。
每个组件在移动端和桌面端的用法一致，由 TUIKit 内部做平台自适应。界面效果如下图所示：
移动端
桌面端
?
?
?
?
?
?
?
?
?
?
消息收发聊天组件
TIMUIKitChat 主要负责消息界面的展示。您可以利用它直接发送不同类型的消息，进行消息表情回应 / 回复 / 引用，并查看消息已读回执详情等操作。
在桌面端，还包括 文件拖入发送 / 截图 / 粘贴图片发送 / 在目录中打开文件 等桌面端特色能力。
界面效果如下图所示：
移动端
桌面端
消息界面
发送多种类型消息
?
?
?
?
?
?
表情回应/回复/引用
文件自动匹配icon
?
?
?
?
?
?
消息已读回执
已读回执详情
?
?
?
?
?
?
群 tips 消息
入群申请审批
?
?
?
?
?
?
链接解析预览
地理位置消息
?
?
?
?
?
?
?
消息界面整体如图所示，包含了桌面端交互常见的消息收发能力。
?
?
除 移动端Tab 展示的功能外，桌面端还包括一些额外的功能，如下方所述。
?
截图 或 粘贴图片至发送区域 直接发送图片。
?
?
拖入多个文件直接发送。
?
?
?
?
消息上，鼠标 Hover 菜单。包含 表情回应 / 消息回复 / 转发 及更多能力。
?
?
?
?
消息上，鼠标右键菜单。包含更多消息操作，如 复制 / 多选 / 删除 / 翻译 / 撤回 等。
?
?
?
文件消息支持在右键菜单中 直接打开 或 打开所在目录。也可点击消息 item 直接打开。
?
?
?
群聊中 @ 其他群成员。在群成员选择面板中，可渐进式输入搜索并选择群成员。被 @ 的群成员可收到特别提醒。
?
?
?
?
历史消息盒子。支持关键词搜索。
?
?
?
?
消息多选。
?
?
关系链系列组件
关系链主要负责当前用户的联系人、群聊、黑名单的信息展示。界面效果如下图所示：
移动端
桌面端
联系人列表(TIMUIKitContact)
好友申请列表(TIMUIKitNewContact)
?
?
?
?
?
?
参与的群聊列表(TIMUIKitGroup)
黑名单列表(TIMUIKitBlackList)
?
?
?
?
?
?
?
联系人列表 - TIMTUIKitContact
?
?
群组列表 - TIMUIKitGroup
?
?
黑名单列表 - TIMUIKitBlackList
?
?
好友申请列表 - TIMUIKitNewContact
?
?
会话列表组件
TIMUIKitConversation 主要负责会话列表的展示和编辑。界面效果如下图所示：
移动端
桌面端
?
?
?
会话列表。当前选中会话 / 置顶的会话 / 未选中会话 分别用不同颜色展示。
?
?
右键操作菜单。包含 清空所有消息 / 会话置顶 / 删除会话 等能力。
?
?
?
?
用户资料与管理组件
TIMUIKitProfile 主要负责联系人的资料展示与管理。界面效果如下图所示：
移动端
桌面端
?
?
?
TIMUIKitProfile 组件在桌面端有两种展示方式布局，小卡片展示 及 联系人详情页。分别用于不同场景。
?
小卡片展示。用于 单聊标题点击 / 群聊其他成员头像点击 等场景。
?
?
?
?
联系人详情页。
?
?
添加好友与群组系列组件
TIMUIKitAddFriend 为添加好友页面。TIMUIKitAddGroup 为添加群组页面。界面效果如下图所示：
移动端
桌面端
?
添加好友页面(TIMUIKitAddFriend)
添加群组页面(TIMUIKitAddGroup)
?
?
?
?
?
?
?
添加好友 - TIMUIKitAddFriend
?
?
?
?
添加群组 - TIMUIKitAddGroup
?
?
?
群资料与管理组件
TIMUIKitGroupProfile 主要负责群资料、群成员、群组权限的展示与管理。界面效果如下图所示：
移动端
桌面端
群资料及管理
群成员管理
?
?
?
?
?
?
加群方式管理
群操作
?
?
?
?
?
?
?
群资料及管理。可展示在群聊右侧，和移动端功能保持一致，只是界面 UI 不同。
?
?
群成员管理。可在群成员卡片中查看全部群成员，并操作群成员增减。点开群成员管理面板后，可配置 管理员 / 群成员禁言 / 全员禁言 等信息。
?
?
群公告编辑。点击群公告卡片，即可将其变为输入框，进行群公告编辑并发布。
?
?
本地搜索系列组件
本地搜索能力，共包括两个不同的组件 TIMUIKitSearch 和 TIMUIKitSearchMsgDetail。
TIMUIKitSearch 为本地全局搜索，支持同时搜索联系人、群聊及聊天记录；TIMUIKitSearchMsgDetail 为会话内聊天历史记录搜索。
移动端
桌面端
全局搜索 - TIMUIKitSearch
?
?
?
会话内搜索 - TIMUIKitSearchMsgDetail
?
?
?
全局搜索 - TIMUIKitSearch
?
?
?会话内搜索 - TIMUIKitSearchMsgDetail
?
?
音视频通话
?TUICallKit插件 用于语音、视频通话。目前仅支持移动端。
?
?
?
集成 Callkit 插件后，TUIKit 的消息发送更多能力面板中，会自动出现拨打音视频电话的 button。
?
?
?
消息推送
您可通过我们的 Flutter 推送插件 集成消息推送能力，涵盖离线推送与在线推送。消息推送效果如下图所示：
?
?
?
联系我们
?点此进入IM社群，享有专业工程师的支持，解决您的难题。