无固定宽度的Widget能否约束Text组件？Flutter布局问题咨询

先修正你代码里的小错误（widget应为width），以下是几种无需固定宽度的响应式布局方案：

方案1：用Expanded包裹文本容器 #

这是最常用的方案，Expanded会让文本容器占据Row中图标容器之外的所有剩余宽度，自动适配Column的宽度，同时文本会在这个宽度内自动换行并支持TextAlign.justify。

示例代码：

Container(
  child: Row(
    children: [
      Container(  //左侧图标容器
        height: 50,
        width: 50,
        color: Colors.green,
        child: const Icon(Icons.ac_unit),
      ),  
      Expanded( // 用Expanded替代原无宽度约束的Container
        child: Container(
          child: Text(
            'a long text inside here...a long text inside here...a long text inside here...',
            textAlign: TextAlign.justify,
          ),
        ),
      ), 
    ],
  ),
)

方案2：用Flexible（灵活适配场景） #

如果不需要文本容器强制占满剩余空间，只是希望它能根据可用空间收缩/扩展，可以用Flexible代替Expanded，效果类似但更灵活：

Container(
  child: Row(
    children: [
      Container(
        height: 50,
        width: 50,
        color: Colors.green,
        child: const Icon(Icons.ac_unit),
      ),  
      Flexible(
        child: Container(
          child: Text(
            'a long text inside here...a long text inside here...a long text inside here...',
            textAlign: TextAlign.justify,
          ),
        ),
      ), 
    ],
  ),
)

方案3：结合ConstrainedBox（带尺寸限制的自适应） #

如果需要给文本容器设置最小/最大宽度限制，同时保持自适应，可以在Expanded里嵌套ConstrainedBox：

Container(
  child: Row(
    children: [
      Container(
        height: 50,
        width: 50,
        color: Colors.green,
        child: const Icon(Icons.ac_unit),
      ),  
      Expanded(
        child: ConstrainedBox(
          constraints: const BoxConstraints(
            minWidth: 200, // 最小宽度
            maxWidth: 300, // 最大宽度
          ),
          child: Container(
            child: Text(
              'a long text inside here...a long text inside here...a long text inside here...',
              textAlign: TextAlign.justify,
            ),
          ),
        ),
      ), 
    ],
  ),
)

原理说明 #

• Row的布局逻辑：先确定固定尺寸子Widget（如图标容器）的大小，再将剩余空间分配给Expanded/Flexible包裹的子Widget。
• Column的宽度约束会传递给Row，因此Expanded的宽度会自动适配Column的可用宽度，实现响应式布局。
• Text在有明确宽度约束的容器内，会自动换行并支持TextAlign.justify对齐，无需设置固定宽度。

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