SliverFillRemaining子组件溢出时无法滚动的问题求助

问题根源 #

1. SliverFillRemaining的设计特性：它的作用是填充CustomScrollView的剩余空间，当子组件高度超过可用空间时，不会触发外层滚动——因为它默认是占满剩余空间而非支持滚动逻辑。
2. 嵌套滚动冲突：内部嵌套的Column+ListView.builder结构，即使给ListView设置shrinkWrap: true和NeverScrollableScrollPhysics()，也无法让外层CustomScrollView正确感知内容溢出，导致滚动完全失效。

解决方案：重构为纯Sliver组件结构 #

移除SliverFillRemaining，将内容拆分为多个Sliver组件直接放入CustomScrollView的slivers列表，统一由外层处理滚动：

return Scaffold(
  appBar: AppBar(...),
  body: SafeArea(
    child: MainPadding(
      child: CustomScrollView(
        physics: const ClampingScrollPhysics(),
        slivers: [
          // 顶部静态内容：用SliverToBoxAdapter转为Sliver组件
          SliverToBoxAdapter(
            child: Column(
              children: [
                const ProgressCirclesBoxSelection(),
                AddressContainer(...),
                const SizedBox(height: 16),
                DottedBorder(...),
                const SizedBox(height: 16),
              ],
            ),
          ),
          // 替换原ListView.builder为SliverList，直接作为CustomScrollView的子组件
          SliverList(
            delegate: SliverChildBuilderDelegate(
              (context, i) {
                // 原ListView的itemBuilder逻辑
                return ...;
              },
              childCount: widget.boxParams.sizes.length,
            ),
          ),
          // 底部按钮：内容不足时固定在底部，内容过长时跟随滚动
          const SliverFillRemaining(
            hasScrollBody: false,
            child: SizedBox(
              width: double.infinity,
              child: ElevatedButton(
                onPressed: () {...},
                child: Text("确认"),
              ),
            ),
          ),
        ],
      ),
    ),
  ),
);

关键修改点说明 #

• SliverToBoxAdapter：将普通Widget（如Column）转为Sliver类型，适配CustomScrollView的组件要求。
• SliverList替代ListView.builder：消除嵌套滚动冲突，让整个滚动逻辑由CustomScrollView统一管理，内容溢出时自然触发滚动。
• 带hasScrollBody: false的SliverFillRemaining：保留按钮在内容不足时固定底部的效果，同时不会阻碍内容过长时的正常滚动。

内容的提问来源于stack exchange，提问作者Karol Wiśniewski