自定义Widget无法均分空间，原生Row、Text等Widget工作正常

核心原因 #

自定义Widget未正确处理父组件传递的布局约束，导致无法填满分配的均等空间。原生Widget（如Text、Row）默认会根据父约束自适应尺寸，但自定义组件若内部布局未设置占满可用空间的逻辑，就会出现尺寸不符合预期的情况。

解决步骤 #

1. 修正自定义Widget的内部布局 #

确保自定义Widget的根组件能占满父组件分配的空间，比如用Container设置无限宽高，或通过alignment对齐内部元素：

错误示例（无法占满空间）：

class CustomQuadrant extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Text("象限内容"); // 仅包裹文本，不会填充父空间
  }
}

正确示例：

class CustomQuadrant extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: double.infinity,
      alignment: Alignment.center,
      child: Text("象限内容"),
    );
  }
}

2. 确保网格布局的约束传递正确 #

如果用Row+Column实现四象限网格，需通过Expanded为每个象限分配均等空间：

Row(
  children: [
    Expanded(
      child: Column(
        children: [
          Expanded(child: CustomQuadrant()), // 左上象限
          Expanded(child: CustomQuadrant()), // 左下象限
        ],
      ),
    ),
    Expanded(
      child: Column(
        children: [
          Expanded(child: CustomQuadrant()), // 右上象限
          Expanded(child: CustomQuadrant()), // 右下象限
        ],
      ),
    ),
  ],
)

3. 移除自定义Widget中的硬编码尺寸 #

如果自定义Widget内部设置了固定width/height，会破坏父组件的约束传递，需删除固定尺寸，改用自适应逻辑。

快速验证方法 #

将自定义Widget临时替换为Container(color: Colors.blue)，若能正常占满均等空间，说明问题完全出在自定义Widget的内部布局逻辑上；若仍无法占满，需检查网格布局的父组件是否正确分配了空间。

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