界面跳转
更新时间: 2025/04/02 17:14:13
IM UIKit 提供统一路由 IMKitRouter
,实现界面的跳转和模块之间的解耦。
IM UIKit 内置界面跳转
IM UIKit 内置的任意界面都可以通过路由地址跳转到其他指定界面。
如何使用路由进行跳转
调用 Navigator
方法进行界面跳转。
方法原型如下:
dart//带参数的界面跳转
Navigator.pushNamed(context, path, arguments: {'paramKey': param});
//不带参数的界面跳转
Navigator.pushNamed(context, path);
参数 | 类型 | 说明 |
---|---|---|
path |
String | 目标界面对应的跳转地址。 |
paramKey |
String | 传递到目标界面的参数 KEY。 |
param |
Object | 传递到目标界面的参数值。 |
context |
BuildContext | 组件上下文。 |
内部路由地址概览
路由地址 |
UIKit 定义 |
Page |
对应界面 |
跳转需传入参数 |
---|---|---|---|---|
imkit://contact/contactList.page | RouterConstants.PATH_CONTACT_PAGE |
ContactPage |
通讯录界面 | 无 |
imkit://contact/selector.page | RouterConstants.PATH_CONTACT_SELECTOR_PAGE |
ContactKitSelectorPage |
通讯录人员选择器 | 无 |
imkit://contact/addFriend.page | RouterConstants.PATH_ADD_FRIEND_PAGE |
AddFriendPage |
添加好友界面 | 无 |
imkit://contact/userInfo.page | RouterConstants.PATH_USER_INFO_PAGE |
ContactKitDetailPage |
用户信息界面 | 参见 跳转至用户信息界面 |
imkit://contact/blackList.page | RouterConstants.PATH_MY_BLACK_PAGE |
ContactKitBlackListPage |
黑名单界面 | 无 |
imkit://contact/teamList.page | RouterConstants.PATH_MY_TEAM_PAGE |
ContactKitTeamListPage |
我的群组界面 | 无 |
imkit://contact/verifyList.page | RouterConstants.PATH_MY_NOTIFICATION_PAGE |
ContactKitSystemNotifyMessagePage |
系统通知(好友申请消息)界面 | 无 |
imkit://chat/chat.page | RouterConstants.PATH_CHAT_PAGE |
ChatPage |
聊天界面(包括单聊和群聊) | 参见 跳转至聊天界面 |
imkit://chat/searchMessage.page | RouterConstants.PATH_CHAT_SEARCH_PAGE |
ChatSearchPage |
聊天内容搜索界面 | 参见 跳转至群聊搜索界面 |
imkit://team/teamSetting.page | RouterConstants.PATH_TEAM_SETTING_PAGE |
TeamSettingPage |
群设置界面 | 参见 跳转至群聊设置界面 |
imkit://search/search.page | RouterConstants.PATH_GLOBAL_SEARCH_PAGE |
SearchKitGlobalSearchPage |
好友搜索界面 | 无 |
imkit://mine/userInfo.page | RouterConstants.PATH_MINE_INFO_PAGE |
UserInfoPage |
我的个人信息界面 | 无 |
imkit://conversation/conversation.page | RouterConstants.PATH_CONVERSATION_PAGE |
ConversationPage |
会话列表页 | 无 |
如果需要使用网易云信在 imkit_router_factory
中封装好的接口进行跳转,需要先导入以下组件:
dartimport 'package:common_ui/router/imkit_router_factory.dart';
跳转至用户信息界面
-
示例代码
dart
// 封装好的接口 goToContactDetail(context, accId); // 使用路由跳转 Navigator.pushNamed(context, RouterConstants.PATH_USER_INFO_PAGE, arguments: {'accId': accId});
-
参数说明
参数 类型 说明 RouterConstants.PATH_USER_INFO_PAGE
String 用户信息界面的跳转地址。 accId
String 查看用户资料的用户 ID。 context
BuildContext 组件上下文。
跳转至聊天界面
-
示例代码
dart
// 封装好的接口,跳转单聊 goToP2pChat(context, userId); // 封装好的接口,跳转群聊 goToTeamChat(context, teamId); // 使用路由跳转 Navigator.pushNamed(context, RouterConstants.PATH_CHAT_PAGE, arguments: {'conversationId': conversationId, 'conversationType': conversationType});
-
参数说明
参数 类型 说明 RouterConstants.PATH_CHAT_PAGE
String 聊天界面的跳转地址。 conversationId
String 用户的 ID/群组的 ID,必传。 conversationType
NIMConversationType 会话类型,必传。 NIMConversationType.p2p
:单聊会话NIMConversationType.team
:群聊会话context
BuildContext 组件上下文。 customPopActions
PopMenuAction? 自定义消息弹框事件,非必传。 onTapAvatar
Function(String? userID, {bool isSelf})? 头像点击事件,非必传。 chatUIConfig
ChatUIConfig? 聊天页面定制化配置,非必传。 messageBuilder
ChatKitMessageBuilder? 聊天自定义消息构建,非必传。
跳转至群聊搜索界面
-
示例代码
dart
Navigator.pushNamed(context, RouterConstants.PATH_CHAT_SEARCH_PAGE, arguments: {'teamId': teamId});
-
参数说明
参数 类型 说明 RouterConstants.PATH_CHAT_SEARCH_PAGE
String 群聊搜索界面的跳转地址。 teamId
String 群组的 ID。 context
BuildContext 组件上下文。
跳转至群聊设置界面
-
示例代码
dart
Navigator.pushNamed(context, RouterConstants.PATH_TEAM_SETTING_PAGE, arguments: {'teamId': teamId});
-
参数说明
参数 类型 说明 RouterConstants.PATH_TEAM_SETTING_PAGE
String 群聊搜索界面的跳转地址。 teamId
String 群组的 ID。 context
BuildContext 组件上下文。
跳转至新增界面
IM UIKit 提供的路由能力,支持根据您的业务需求新增界面,并支持从其他界面跳转至新增界面。在通过路由实现跳转前,需调用 registerRouter
方法注册该新增界面的路由地址。
如果需要传递参数,需要使用 getArgumentFormMap
方法获取对应类型的参数。
方法原型如下:
dartIMKitRouter.instance.registerRouter(String name, WidgetBuilder builder, {Map<String, Object>? arguments,bool cover = false})
参数 | 类型 | 说明 |
---|---|---|
name |
String | 注册界面对应的跳转地址。 |
builder |
WidgetBuilder | 目标组件 Builder 方法。 |
arguments |
Map<String, Object>? | 跳转需要携带的参数。 |
cover |
bool | 是否覆盖之前注册的路由。 |
示例代码
dart// 注册群聊设置页面路由
IMKitRouter.instance.registerRouter(
RouterConstants.PATH_TEAM_SETTING_PAGE,
(context) => TeamSettingPage(
UIKitRouter.getArgumentFormMap<String>(context, 'teamId')!));
路由的界面注册机制采用覆盖模式,即相同的 name
,后注册的界面会覆盖之前注册的界面。
此文档是否对你有帮助?