flutter-nested-scroll-coordination

1. 实验目标

验证 Flutter 里两条滚动协同实现路径：

• 主方案：NestedScrollView + SliverAppBar + TabBar（header slivers）+ TabBarView（内层 ListView）
• 对照方案：ScrollController + NotificationListener

目标不是让两套都能滚，而是帮助你判断：

• 哪种是结构化方案
• 哪种只是手工补位
• 复杂页面（折叠头 + Tab + 内层列表）里为什么优先 Sliver 体系

2. 工程要点

• 外层 TabController（_mainTabController）切换「Sliver 主方案 / 手工联动对照」
• 内层 TabController（_innerTabController）驱动 NestedScrollView 头部 TabBar 与 TabBarView
• NestedScrollView 负责 outer/inner scroll 协同；SliverOverlapAbsorber + SliverOverlapInjector 对齐 TabBar 占位
• SliverAppBar 负责折叠头部与 pinned 行为；innerBoxIsScrolled 在 flexibleSpace 中实时展示
• NotificationListener 方案只做手工 offset 协同，便于看清它的边界
• 页面里同步展示当前 header offset、innerBoxIsScrolled 与首项位置

3. 运行方式

cd labs/flutter/host
flutter pub get
flutter run -d macos

启动后在首页进入 Flutter 嵌套滚动协同。

4. 预期现象

• Sliver 主方案：折叠头先收起 → TabBar 吸顶 → 当前 Tab 的内层列表继续滚；切换「推荐 / 最新」Tab 时滚动位置各自保留
• innerBoxIsScrolled 在头部展开/折叠时切换，首项 subtitle 说明 SliverOverlapInjector 对齐效果
• 手工方案：可以看到头部 offset 跟着变，但结构和边界明显更脆
• 两套对照能直接看出“结构化协同”和“监听式协同”的差别

5. 对应知识库文档

• 理论主文档：Jetpack Compose 嵌套滚动与滚动协同
• 状态分层总览：状态管理、路由、架构

6. 关键源码

• flutter_nested_scroll_coordination_page.dart