Flutter文本溢出问题：实现文本换行并让父容器自适应展开的解决方案咨询

嘿，我来帮你搞定这个文本溢出的问题！你的核心问题在于Row组件中的Column没有被限制宽度——Row默认会让子组件尽可能占用水平空间，导致里面的Text无限延伸，最终溢出屏幕。你之前尝试用Expanded包裹单个Text是找错了对象，应该把整个放文本的Column用Expanded包起来。

修改方案 #

这里是调整后的代码，我标记了关键改动：

Widget build(BuildContext context) { 
  return GestureDetector( 
    onTap: onTap, 
    child: Padding( 
      padding: EdgeInsets.only( 
        bottom: 14.scaled, 
      ), 
      child: Container( 
        // 注释掉固定height是正确的，让容器自适应高度
        // height: 70.scaled, 
        decoration: BoxDecoration( 
          boxShadow: [verySoftDarkShadow], 
          color: white, 
          borderRadius: BorderRadius.circular(10.scaled), 
        ), 
        child: Row( 
          crossAxisAlignment: CrossAxisAlignment.center, 
          children: [ 
            SizedBox( 
              width: 20.scaled, 
            ), 
            // 关键改动：用Expanded包裹整个Column
            Expanded(
              child: Column( 
                mainAxisAlignment: MainAxisAlignment.center, 
                crossAxisAlignment: CrossAxisAlignment.start, 
                children: [ 
                  Text( 
                    shortArticle.label!, 
                    style: alternativeText, 
                    // 可选：明确允许无限换行（默认就是null，可加可不加）
                    maxLines: null, 
                  ), 
                  Text( 
                    shortArticle.manufacturerLabel ?? '', 
                    style: alternativeText.copyWith(color: darkGray), 
                    maxLines: null, 
                  ), 
                ], 
              ),
            ), 
            Spacer(), 
            SvgIconButton( 
              onTap: () { 
                print('tapped'); 
              }, 
              svgPath: 'images/vertical_menue_dots.svg', 
              width: touchTargetSizeForIconButton, 
              height: touchTargetSizeForIconButton, 
              svgSize: 16.scaled, 
            ), 
          ], 
        ), 
      ), 
    ), 
  ); 
}

为什么这样改？ #

1. Expanded包裹Column：让Column占据Row中除了左侧SizedBox和右侧图标按钮之外的所有水平空间，直接限制了文本的可用宽度，这样Text就会自动换行。
2. 移除固定height：你已经注释掉了Container的固定高度，这很关键——这样容器会根据文本的行数自动调整自身高度，实现自适应展开。
3. maxLines: null：明确告诉Text组件可以无限换行（默认值就是null，添加只是让代码更清晰），避免文本被截断。

这样修改后，当文本内容过长时会自动换行，Container的高度会跟着文本高度动态调整，同时右侧的图标按钮始终保持在Row的最右端，完全符合你的需求。

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