产品动态
公告
git clone https://github.com/Tencent-RTC/TUIKit_Flutter.git
atomic-x/├── lib/ # UI 组件源码(必需集成)│ ├── messagelist/ # 消息列表组件│ ├── messageinput/ # 消息输入组件│ ├── conversationlist/ # 会话列表组件│ ├── contactlist/ # 联系人列表组件│ ├── basecomponent/ # 基础组件│ └── ... # 其他 UI 组件├── call_assets/ # call 资源文件(必需集成)├── chat_assets/ # chat 资源文件(必需集成)chat/├── uikit/ # Page 组件(参考实现)│ ├── lib/│ ├── chat_page.dart│ ├── contacts_page.dart│ └── conversations_page.dart└── demo/ # 示例应用(可选参考)

pubspec.yaml 文件中添加组件:tencent_chat_uikit:path: ../TUIKit_Flutter/chat/uikit
tuikit_atomic_x: ^3.6.3
tuikit_atomic_x:path: ../TUIKit_Flutter/atomic-x
chat/uikit/pubspec.yaml 文件里的 tuikit_atomic_x 依赖,从方式二提到的两种集成方式任选一种使用。post_install do |installer|installer.pods_project.targets.each do |target|flutter_additional_ios_build_settings(target)target.build_configurations.each do |config|config.build_settings['EXCLUDED_ARCHS[sdk=iphonesimulator*]'] = 'arm64'config.build_settings['ENABLE_BITCODE'] = 'NO'config.build_settings["ONLY_ACTIVE_ARCH"] = "NO"endtarget.build_configurations.each do |config|config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= ['$(inherited)','PERMISSION_MICROPHONE=1','PERMISSION_CAMERA=1','PERMISSION_PHOTOS=1',]endendend
~/.gradle/init.gradle,运行如下命令:# 或者直接删除:rm -f ~/.gradle/init.gradlemv ~/.gradle/init.gradle ~/.gradle/init.gradle.backup
~/.gradle/init.gradle,请忽略。如果存在,并且该文件里配置有 allprojects.repositories,可以删除 allprojects.repositories 相关内容,或者删除 ~/.gradle/init.gradle(建议备份文件),以免引起运行报错。chat/demo 目录下的 gradle.properties 里增加一条 org.gradle.java.home,用来配置 JDK 17 路径,请替换成您实际的 JDK 17 的完整路径。参考如下:# 请替换为您本地 JDK 17 的真实完整路径org.gradle.java.home=xx/Java/JavaVirtualMachines/jdk-17.0.6.jdk/Contents/Home

final result = await LoginStore.shared.login(sdkAppID: SDKAPPID,userID: userID,userSig: userSig,);if (result.errorCode == 0) {// 登录成功,可跳转聊天或会话页} else {// 登录失败,可弹框报错}

chat/uikit/lib/conversations_page.dart 文件里的实现,ConversationsPage 主要做了以下工作:@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(backgroundColor: colorsTheme.bgColorOperate,title: Text(atomicLocale.chat, style: TextStyle(fontSize: 34, fontWeight: FontWeight.w600)),centerTitle: false,scrolledUnderElevation: 0,actions: [],),body: Column(children: [Expanded(child: ConversationList(onConversationClick: (conversation) {Navigator.push(context,MaterialPageRoute(builder: (context) => ChatPage(conversation: conversation,),),);},),),],),);}

chat/uikit/lib/chat_page.dart 文件里的实现,ChatPage 主要做了以下工作:@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(backgroundColor: colorsTheme.bgColorOperate,titleSpacing: 4.0,centerTitle: false,title: GestureDetector(onTap: _onTitleTap,child: Row(mainAxisSize: MainAxisSize.min,children: [Padding(padding: const EdgeInsets.only(right: 8.0),child: Avatar.image(name: widget.conversation.title,url: widget.conversation.avatarURL,),),Expanded(child: Text(widget.conversation.title ?? atomicLocale.chat,style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600),overflow: TextOverflow.ellipsis,maxLines: 1,),),],),),scrolledUnderElevation: 0.0,leading: IconButton.buttonContent(content: IconOnlyContent(Icon(Icons.arrow_back_ios, color: colorsTheme.buttonColorPrimaryDefault)),type: ButtonType.noBorder,size: ButtonSize.l,onClick: () => Navigator.of(context).pop(),),actions: []),body: Column(children: [MessageList(conversationID: widget.conversation.conversationID,locateMessage: widget.message,onUserClick: (String userID) => _onUserClick(userID),),MessageInput(conversationID: widget.conversation.conversationID,),],),);}

chat/uikit/lib/contacts_page.dart 文件里的实现,ContactsPage 主要做了以下工作:@overrideWidget build(BuildContext context) {AtomicLocalizations atomicLocale = AtomicLocalizations.of(context);SemanticColorScheme colorsScheme = BaseThemeProvider.colorsOf(context);return Scaffold(appBar: AppBar(backgroundColor: colorsScheme.bgColorOperate,title: Text(atomicLocale.contact, style: TextStyle(fontSize: 34, fontWeight: FontWeight.w600),),centerTitle: false,scrolledUnderElevation: 0,actions: [],),body: ContactList(onGroupClick: (ContactInfo contactInfo) {_onGroupClick(context, contactInfo);},onContactClick: (ContactInfo contactInfo) {_onContactClick(context, contactInfo);},),);}
Page | 回调 | 建议跳转逻辑 |
ConversationsPage | onConversationClick: (conversation) {} | 点击会话列表中的会话时触发,建议跳转到聊天页面(ChatPage)。 |
ContactsPage | onContactClick: (ContactInfo contactInfo) {} | 点击联系人 cell 时触发,建议跳转到用户信息页(C2CChatSetting)。 |
| onGroupClick: (ContactInfo contactInfo) {} | 点击群组 cell 时触发,建议跳转到群聊页面(ChatPage)。 |
ChatPage | onUserClick: (String userID) {} | 点击消息中的用户头像或昵称时触发,建议跳转到用户信息页(C2CChatSetting)。 |
| onChatHeaderClick: () {} | 点击导航栏中的头像时触发,建议跳转到用户信息页(C2CChatSetting)或群聊信息页(GroupChatSetting) |
| onBackClick: () {} | 点击返回按钮时触发,建议返回上一级页面。 |
theme_state 和 atomic_localizations 的报错怎么办?main.dart 文件中使用 ComponentTheme 来包装根 widget,并且需要在 MaterialApp 的 localizationsDelegates 中增加 AtomicLocalizations.delegate 的配置,可参考源码 Demo 中的 main.dart 文件的使用。文档反馈