如何获取CustomScrollView实际屏幕占用尺寸以适配动态卡片？

• 使用CustomScrollView实现垂直无限滚动列表，自定义卡片支持动态加载
• 需求：卡片尺寸与CustomScrollView在屏幕上的实际占用尺寸完全匹配（而非屏幕整体尺寸）
• 当前困境：硬编码卡片尺寸无法适配动态变化的AppBar高度；double.infinity会导致卡片无限扩展；MediaQuery配合硬编码减去AppBar固定高度的方式也失效

可以通过LayoutBuilder获取CustomScrollView的可用空间，再将尺寸传递给内部卡片，具体实现如下：

方案1：外部传递尺寸 #

在CustomScrollView外层包裹LayoutBuilder，它能直接获取当前容器的可用宽高约束，再将该尺寸传递给卡片组件：

LayoutBuilder(
  builder: (context, constraints) {
    final availableWidth = constraints.maxWidth;
    final availableHeight = constraints.maxHeight;

    return CustomScrollView(
      slivers: [
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (context, index) => CustomCard(
              width: availableWidth,
              height: availableHeight,
              // 卡片其他配置项
            ),
            childCount: null, // 实现无限滚动
          ),
        ),
      ],
    );
  },
)

如果CustomScrollView嵌套在Scaffold中，LayoutBuilder会自动计算扣除动态AppBar后的剩余空间，无需手动计算AppBar高度。

方案2：卡片内部自动适配 #

直接在自定义卡片内部使用LayoutBuilder，让卡片自动占满父级分配的空间，无需外部传递尺寸：

class CustomCard extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(
      builder: (context, constraints) {
        return Container(
          width: constraints.maxWidth,
          height: constraints.maxHeight,
          // 卡片内容布局
        );
      },
    );
  }
}

• LayoutBuilder的核心是获取当前组件所在父容器的实时约束信息，能完美适配AppBar高度变化、屏幕旋转等动态布局场景
• 避免使用MediaQuery手动计算尺寸，因为它获取的是整个屏幕的尺寸，无法应对布局嵌套、动态组件尺寸变化的情况

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