在非Material/Cupertino的Flutter应用中，为指定尺寸的子元素添加Row时，为何Flutter会计算顶级Container的尺寸？

我来帮你拆解这个问题，其实根源不是Row本身，而是你顶级Container的尺寸设置和父组件Center的约束冲突了，我们一步步捋清楚：

问题核心原因 #

• 顶级Container的无限尺寸与Center的冲突：你给最外层的Container设置了height: double.infinity和width: double.infinity，但它的父组件是Center。Center的布局逻辑是让子组件尽量贴合自身内容尺寸，再居中显示。当子组件要求无限大的尺寸时，Center根本无法满足这个约束——这就导致后续LayoutBuilder拿到的约束是无效的，进而影响到里面Row的布局计算，最终抛出未布局的异常。
• 空Row的潜在问题：你当前的Row是完全空的，即使给它的父级ConstrainedBox设置了约束，Row默认的mainAxisSize: MainAxisSize.max会尝试占满可用宽度，但空Row没有子组件支撑尺寸，在异常约束下很容易触发布局报错。

修复后的代码示例 #

@override
Widget build(BuildContext context) {
  return Container(
    // 去掉外层Center（如果不需要强制居中），或者保留Center但移除Container的无限尺寸设置
    decoration: const BoxDecoration(
      gradient: LinearGradient(colors: [
        Color.fromARGB(136, 255, 0, 191),
        Color.fromARGB(199, 165, 10, 255)
      ], transform: GradientRotation(4)),
    ),
    child: LayoutBuilder(
      builder: (BuildContext context, BoxConstraints constraints) {
        return Column(children: <Widget>[
          ConstrainedBox(
            constraints: BoxConstraints(
              maxHeight: constraints.maxHeight / 4,
              maxWidth: constraints.maxWidth, // 用LayoutBuilder提供的实际可用宽度而非无限值
            ),
            child: Row(
              // 空Row建议设置mainAxisSize: MainAxisSize.min，或者添加实际子组件
              mainAxisSize: MainAxisSize.min,
              children: const [
                Text("顶部行内容"),
                // 可以根据需求添加更多子组件
              ],
            ),
          ),
          HomeTaskSpace(constraints),
        ]);
      }),
  );
}

额外说明 #

如果你确实需要页面整体居中的效果，可以保留外层的Center，但必须移除Container的height: double.infinity和width: double.infinity——让Container的尺寸由父级Center和自身内容共同决定，或者用MediaQuery.of(context).size获取屏幕尺寸来设置固定宽高。

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