Flutter中ListView.Builder为何出现RenderFlex溢出错误？

你遇到的溢出问题，核心原因是Column 是无限制的垂直布局容器，它不会自动处理超出屏幕的内容滚动。虽然你给 ListView 加了 shrinkWrap: true，但这个属性只是让 ListView 根据子项内容计算自身高度，并没有限制它在 Column 里的占用空间。当 ListView 的内容高度加上上方的 Text('home') 超过屏幕可用高度时，Column 就会因为无法容纳所有子组件而抛出溢出错误。

解决方案：用 Expanded 包裹 ListView #

给 ListView 外层套一个 Expanded，这样 Column 会分配给它屏幕剩余的所有可用高度，ListView 就能在这个固定高度内滚动，不会撑爆 Column。修改后的代码如下：

return Scaffold(
  appBar: HoomeAppBar(context),
  body: Column(
    children: [
      Text('home'),
      // 用 Expanded 包裹 ListView，占用剩余空间
      Expanded(
        child: ListView.builder(
          itemCount: 2,
          shrinkWrap: true,
          itemBuilder: (context, index) {
            return Container(
              width: 200,
              height: 300,
              child: Column(
                children: [
                  Text(reviews[index].name),
                  Text(reviews[index].reviewBody),
                ],
              ),
            );
          },
        ),
      ),
    ],
  ),
);

补充优化：处理子项内的文本溢出 #

如果评论内容（reviewBody）过长，子项里的 Column 也可能出现水平或垂直溢出，建议给 Text 加上溢出处理：

Text(
  reviews[index].reviewBody,
  maxLines: 5, // 限制最大行数
  overflow: TextOverflow.ellipsis, // 超出部分显示省略号
),

或者用 Expanded 包裹 Text，让它在 Container 内自动换行：

Container(
  width: 200,
  height: 300,
  child: Column(
    children: [
      Text(reviews[index].name),
      Expanded(
        child: Text(reviews[index].reviewBody),
      ),
    ],
  ),
);

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