Flutter：Scrollable Stack滚动实现遇断言错误，求解决方案

方案一：调整布局结构（推荐） #

把重叠布局拆分，用Column作为滚动容器的主体，通过偏移实现组件重叠效果，既能保留设计样式，又能让滚动容器获得确定高度：

SingleChildScrollView(
  child: Column(
    children: [
      // 包裹图片轮播、返回按钮、Ming按钮的Stack，高度固定为图片轮播的高度
      SizedBox(
        height: imageHeight,
        child: Stack(
          children: [
            imageCarousel(),
            Positioned(
              top: 10,
              right: 20,
              child: AnimatedBackButton(
                onTap: () {
                  Navigator.pop(context);
                },
                buttonWidth: 50,
                buttonHeight: 50,
              ),
            ),
            if (showMingButton)
              Positioned(
                top: imageHeight - 50,
                width: deviceWidth,
                child: mingButton(),
              ),
          ],
        ),
      ),
      // 信息框向上偏移20像素，实现和图片轮播的重叠
      Transform.translate(
        offset: Offset(0, -20),
        child: informationBox(showMingButton: showMingButton),
      ),
    ],
  ),
)

方案二：给Stack添加确定高度（适合保留原结构的场景） #

如果必须保留原Stack结构，需要让Stack获得明确高度。可以通过添加未定位子组件撑开高度，同时需要先获取informationBox的实际高度：

1. 给informationBox添加全局Key：

final infoBoxKey = GlobalKey();

2. 在组件渲染完成后获取高度：

double infoBoxHeight = 0;

@override
void initState() {
  super.initState();
  WidgetsBinding.instance.addPostFrameCallback((_) {
    final renderBox = infoBoxKey.currentContext?.findRenderObject() as RenderBox?;
    if (renderBox != null) {
      setState(() {
        infoBoxHeight = renderBox.size.height;
      });
    }
  });
}

3. 修改原Stack结构，添加撑开高度的未定位容器：

SingleChildScrollView(
  child: Stack(
    children: [
      // 未定位容器，用来强制Stack获得确定高度
      if (infoBoxHeight > 0)
        SizedBox(
          height: imageHeight - 20 + infoBoxHeight,
          width: deviceWidth,
        ),
      // 原有的所有Positioned组件
      Positioned(
        top: 0,
        left: 0,
        right: 0,
        child: imageCarousel(),
      ),
      Positioned(
        top: imageHeight - 20,
        left: 0,
        right: 0,
        child: informationBox(
          key: infoBoxKey,
          showMingButton: showMingButton,
        ),
      ),
      if (showMingButton)
        Positioned(
          top: imageHeight - 50,
          width: deviceWidth * 1,
          child: mingButton(),
        ),
      Positioned(
        top: 10,
        right: 20,
        child: AnimatedBackButton(
          onTap: () {
            Navigator.pop(context);
          },
          buttonWidth: 50,
          buttonHeight: 50,
        ),
      ),
    ],
  ),
)

错误原因解释 #

你遇到的size.isFinite断言错误，本质是所有子组件都用Positioned包裹的Stack无法自动确定自身大小。SingleChildScrollView要求子组件必须有明确高度，而没有未定位子组件的Stack会尝试无限扩展高度，导致滚动容器无法正常工作。

方案一通过拆分布局让滚动容器高度由Column自动计算，是最稳定易维护的方式；方案二则通过强制给Stack设置高度解决问题，但需要处理组件高度的异步获取，适合必须保留原Stack结构的场景。

内容的提问来源于stack exchange，提问作者L.Goyal