Flutter中Row内Text容器溢出求助，Expanded组件无效

问题根源 #

你的messageBubble函数里，Row容器未给内部Text组件提供宽度约束，导致长文本会直接超出屏幕范围。之前尝试的Expanded/Flexible因层级错误，无法生效。

修复后的代码 #

修改messageBubble函数，给包含Text的容器添加Flexible约束，并限制气泡最大宽度：

Row messageBubble(String text, bool isMine, BuildContext context) {
  return Row(
    mainAxisAlignment: isMine ? MainAxisAlignment.end : MainAxisAlignment.start,
    crossAxisAlignment: CrossAxisAlignment.start, // 确保气泡顶部对齐
    children: <Widget>[
      if (!isMine) const SizedBox(width: 10), // 左侧气泡留边距
      Flexible(
        child: Padding(
          padding: const EdgeInsets.all(8),
          child: Container(
            constraints: BoxConstraints(
              maxWidth: MediaQuery.of(context).size.width * 0.7, // 限制最大宽度为屏幕70%
            ),
            decoration: BoxDecoration(
              color: Colors.white.withOpacity(0.3),
              borderRadius: BorderRadius.only(
                topLeft: const Radius.circular(20),
                topRight: const Radius.circular(20),
                bottomLeft: isMine ? const Radius.circular(20) : const Radius.circular(0),
                bottomRight: isMine ? const Radius.circular(0) : const Radius.circular(20),
              ), // 优化气泡圆角，贴合聊天界面习惯
            ),
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
              child: Text(
                text,
                style: kSmallText,
                softWrap: true, // 明确开启自动换行
                overflow: TextOverflow.visible, // 溢出时自动换行
              ),
            ),
          ),
        ),
      ),
      if (isMine) const SizedBox(width: 10), // 右侧气泡留边距
    ],
  );
}

调用时的修改 #

在ListView.builder的itemBuilder中调用时，需要传入context：

return messageBubble(
  doc["message"],
  Provider.of<UserProvider>(context, listen: false).userEmail == doc["user"],
  context, // 新增传递context
);

关键说明 #

1. Flexible层级：必须将包含Text的Container直接放在Flexible内部，这样Row才会给它分配可用宽度，触发Text自动换行。
2. 最大宽度限制：通过maxWidth约束气泡宽度，避免长文本撑满屏幕，提升界面美观度。
3. 圆角优化：根据消息归属调整气泡圆角，更符合聊天场景的视觉习惯。

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