Flutter 使用大标题CupertinoNavBar时如何禁用滚动效果

原因说明 #

你直接给NestedScrollView添加physics: NeverScrollableScrollPhysics()不生效，是因为CupertinoSliverNavigationBar本身是Sliver类型组件，默认和NestedScrollView的滚动逻辑深度绑定，单纯配置滚动物理属性无法切断二者的联动关系。

解决方案 #

根据你的页面需求可以选择以下两种实现方式：

方案1：页面无滚动需求的最简实现

如果你的页面本身没有需要滚动的内容，完全不需要滚动能力，直接弃用NestedScrollView，给CupertinoPageScaffold的navigationBar参数直接传普通CupertinoNavigationBar即可，它支持固定显示大标题，不会触发滚动伸缩效果：

@override
Widget build(BuildContext context) {
  return CupertinoPageScaffold(
    navigationBar: CupertinoNavigationBar(
      largeTitle: const Text('Settings'),
      // 可选配置：不需要展示收缩后的中间小标题时可关闭
      automaticallyImplyMiddle: false,
    ),
    child: const Center(child: Text('Home Page')),
  );
}

方案2：保留Body滚动能力，仅禁用导航栏伸缩效果

如果你的页面Body部分有需要滚动的内容，但希望导航栏始终保持大标题状态、不会跟着滚动收缩，直接将导航栏改为非Sliver的固定版本，Body部分单独用滚动组件包裹即可，二者逻辑完全解耦：

@override
Widget build(BuildContext context) {
  return CupertinoPageScaffold(
    navigationBar: const CupertinoNavigationBar(
      largeTitle: Text('Settings'),
      automaticallyImplyMiddle: false,
    ),
    // Body部分单独配置滚动能力，不会影响导航栏状态
    child: SingleChildScrollView(
      child: Column(
        children: List.generate(20, (index) => Padding(
          padding: const EdgeInsets.all(16.0),
          child: Text('列表项 $index'),
        )),
      ),
    ),
  );
}

内容的提问来源于stack exchange，提问作者MobileMon