Skip to content

路由与页面实现

本页说明 Flutter 前端的路由结构、主要入口和页面推进方式,重点放在工程实现而不是用户旅程。

导航真相源

当前前端导航真相源是:

  • MaterialApp.routes
  • MaterialApp.onGenerateRoute
  • 页面内 Navigator.push / pushReplacement / pushAndRemoveUntil
  • AppTransitions.* 自定义转场

明确不是:

  • GoRouter
  • 全局声明式路由树

根路由表

来自 apps/flutter_app/lib/main.dart 的命名路由如下:

Route页面说明
/splashSplashScreen启动页
/homeHomeScreen主容器
/chatChatScreenChat 主界面
/chat/historyChatHistoryScreen聊天历史页
/registrationPhoneInputScreen手机号注册 / 登录入口
/onboardingOnboardingFlowScreen建档流程
/health-overviewHealthOverviewScreen代码仍保留的隐藏入口
/weekly-reportWeeklyReportScreen代码仍保留的隐藏入口

默认 home 不是 /home,而是 home: SplashScreen()

onGenerateRoute 兜底规则

当前只对以下命名路由显式指定转场:

路由转场
/health-overviewAppTransitions.pushDetail(...)
/weekly-reportAppTransitions.slideUp(...)
/chat/historyAppTransitions.slideUp(...)

其余主要依赖:

  • routes 直接生成
  • 页面内部手工 Navigator.push(...)

页面内导航模式

场景当前模式示例
启动分流pushReplacement(MaterialPageRoute)SplashScreen
登录完成清栈pushAndRemoveUntil(AppTransitions.fade(...))PasswordLoginScreen
普通详情推进Navigator.push(AppTransitions.pushDetail(...))PhoneInputScreenProfilePageExerciseScreen
编辑流程返回push + pop(result)OnboardingFlowScreen(isEditMode: true)
主业务切换容器内部 tab / bottom navigationHomeScreen

结构化理解

1. 外层路由只覆盖一部分核心入口

  • App 级命名路由数量不多。
  • 很多重要页面并不是通过命名路由统一调度,而是通过页面内部直接 push

2. 主页内部承担了第二层导航职责

  • HomeScreen 自己维护底部 4 栏索引。
  • 首页 tab 内部又维护 首页 / 日历 顶层 tab。
  • 因此有一大部分导航不是“路由跳转”,而是“容器内部切页”。

3. 当前导航实现仍以 Navigator 为中心

  • 文档和代码都应坚持 MaterialApp + Navigator
  • 后续如果真迁移到 GoRouter,需要单独修正文档,而不是提前写成未来式。

需要明确的实现事实

  • ChatHistoryScreen 同时存在命名路由和 Chat 抽屉两种历史入口。
  • HealthOverviewScreenWeeklyReportScreen 是命名路由存在,但当前入口隐藏,不属于当前可达主流程。
  • Onboarding 既可以通过 /onboarding 命名路由进入,也可以在 ProfilePage 中以编辑模式直接 push。

鉴权与访问行为

页面当前访问行为
SplashScreen默认入口,负责登录态分流
PhoneInputScreen / PasswordLoginScreen未登录入口
HomeScreen登录完成后的主容器
OnboardingFlowScreen首次登录未完成建档时进入;已登录用户也可从个人中心编辑进入
HealthOverviewScreen / WeeklyReportScreen已注册命名路由,但当前入口已隐藏,不属于现阶段可达主导航

从工程视角看,这份路由表最重要的价值,不只是列出有哪些路径,而是帮助读者区分:

  • 哪些页面依赖命名路由进入
  • 哪些页面实际上是主容器内部切换
  • 哪些页面只保留代码和路由,不属于当前可达入口

来源锚点

  • apps/flutter_app/lib/main.dart
  • apps/flutter_app/lib/screens/splash/splash_screen.dart
  • apps/flutter_app/lib/screens/auth/password_login_screen.dart
  • apps/flutter_app/lib/screens/home/home_screen.dart
  • apps/flutter_app/lib/config/theme/app_transitions.dart