Flutter中BoxConstraints无限宽问题：如何避免硬设宽高？

嘿，我完全懂你不想用硬编码固定高度的痛点——这种写法太不灵活，没法适配内容变化。其实我们只需要调整一下Widget的嵌套结构，就能让容器自动适配内容，同时避开无限约束的报错。

原代码的问题分析 #

你原来的代码里用了固定高度的SizedBox，还在Row里设置了CrossAxisAlignment.stretch——这个属性会要求子Widget占满父级的高度，但如果父级没有明确的高度约束（比如去掉SizedBox的height），Flutter就会抛出BoxConstraints无限高度的错误，因为它不知道该怎么计算这个“无限”的高度。

无需固定高度的解决方案 #

我们可以用IntrinsicHeight替代原来的SizedBox，它会自动让Row的高度由内部最高的子元素决定，同时还能保留CrossAxisAlignment.stretch的效果，让子Widget填满Row的高度：

Container(
  margin: const EdgeInsets.symmetric(vertical: 4.0, horizontal: 16.0),
  child: InkWell(
    child: Card(
      child: IntrinsicHeight( // 替换固定高度的SizedBox
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            Expanded(
              child: ListTile(
                title: Text('foo'),
                // 这里加subtitle也会自动调整高度
                // subtitle: Text('这是副标题'),
              ),
            ),
            Container(
              color: Colors.blue,
              alignment: Alignment.center,
              padding: const EdgeInsets.symmetric(horizontal: 10.0),
              child: Text(
                "foo",
                style: TextStyle(color: Colors.white),
              ),
            ),
          ],
        ),
      ),
    ),
  ),
)

方案说明 #

• IntrinsicHeight 的作用是让父级（这里是Row）的高度由其内部最高的子Widget来决定，相当于动态计算出一个合适的高度，而不是硬写死数值。
• 保留CrossAxisAlignment.stretch后，Row里的子Widget（ListTile和蓝色Container）会自动填满这个动态计算出的高度，完全适配内容的变化。
• 现在不管ListTile里的内容变多（比如加副标题、多行文本），整个布局的高度都会自动调整，蓝色容器也会同步拉伸，不需要手动修改任何数值。

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