如何在无主体内容时实现SliverAppBar滚动收起？

需求目标 #

• 场景1：视图整体可滚动，无内容时NoData容器填充屏幕剩余空间，不能滑到SliverAppBar下方。
• 场景2：支持滚动收起SliverAppBar、背景图、TabBar，让NoData容器占满屏幕（至少覆盖收起后的剩余区域）。
• 场景3：仅一条内容时，保持整体滚动特性，避免插入Row后出现错位问题。
• 场景4：多条内容时，先滚动收起SliverAppBar，之后继续滚动内容列表。

当前问题 #

• 无主体内容时，SliverAppBar固定无法滚动收起；
• 添加独立滚动视图时，内容自行滚动但SliverAppBar保持固定，无法联动；
• 使用SliverFillRemaining时，哪怕只有一条内容，容器也会滑到SliverAppBar下方，无法正确填充剩余空间。

现有SliverAppBar代码 #

SliverAppBar(
    expandedHeight: 512,
    collapsedHeight: kToolbarHeight,
    toolbarHeight: kToolbarHeight,
    pinned: true,
    floating: false,
    snap: false,
    elevation: 0,
    backgroundColor: theme.primaryColor,
    leading: CloseButton(onPressed: onBackButton),
    title: Text("Title"),
    automaticallyImplyLeading: false,
    stretch: true,
    flexibleSpace: const FlexibleSpaceBar(
        background: getBackground(), // 带信息的背景图
    ),
    bottom: getBottom(), // TabBar
)

尝试过的方案及痛点 #

• 手动计算SliverAppBar收起后的剩余屏幕空间，但无法实现内容与AppBar的联动滚动；
• 将计算高度后的Container放入SliverFillRemaining，高度设置被忽略，达不到预期；
• 尝试过SliverListDelegate，但少量内容时用列表构建器显得冗余不合理；
• 目前多数解决方案都像临时hack，质疑为何SliverAppBar无法原生支持始终滚动收起的逻辑。

解决建议 #

方案1：CustomScrollView + SliverList + SliverFillRemaining组合 #

核心是利用hasScrollBody: false让SliverFillRemaining仅填充视口剩余空间，不独立滚动，由CustomScrollView统一控制联动：

CustomScrollView(
  slivers: [
    // 你的SliverAppBar
    yourSliverAppBar,
    // 内容列表
    SliverList(
      delegate: SliverChildBuilderDelegate(
        (context, index) => yourContentItems[index],
        childCount: contentItems.length,
      ),
    ),
    // 兜底的无内容占位
    SliverFillRemaining(
      hasScrollBody: false, // 关键：禁用自身滚动，避免滑到AppBar下方
      child: contentItems.isEmpty ? NoDataWidget() : SizedBox.shrink(),
    ),
  ],
)

方案2：NestedScrollView + LayoutBuilder精确控高 #

通过LayoutBuilder获取视口高度，强制设置body的最小高度，确保即使内容少也能触发滚动收起AppBar：

NestedScrollView(
  headerSliverBuilder: (context, innerBoxIsScrolled) => [yourSliverAppBar],
  body: LayoutBuilder(
    builder: (context, constraints) {
      final tabBarHeight = (getBottom() as TabBar).preferredSize.height;
      final minScrollHeight = constraints.maxHeight - (kToolbarHeight + tabBarHeight);
      
      return SingleChildScrollView(
        child: SizedBox(
          height: max(
            contentItems.isEmpty ? constraints.maxHeight : contentItemsTotalHeight,
            minScrollHeight,
          ),
          child: contentItems.isEmpty 
              ? NoDataWidget() 
              : Column(children: contentItems),
        ),
      );
    },
  ),
)

方案3：自定义Sliver组件（进阶） #

如果上述方案仍不满足，可自定义Sliver组件，重写SliverGeometry的计算逻辑，精确控制内容布局范围，从根源上避免SliverFillRemaining的布局问题。

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