Flutter：Text左对齐失效且缩放异常问题求助

问题核心 #

在可拖拽缩放的ResizeableWidget中，嵌套FittedBox(fit: BoxFit.contain)包裹Text组件时：

• 单独设置TextAlign.left无效，文本仍居中显示
• 在FittedBox外层套Align实现左对齐后，文本无法随ResizeableWidget尺寸变化缩放

原因分析 #

1. TextAlign.left无效的原因：FittedBox默认使用Alignment.center对齐，即使Text自身左对齐，缩放后的整个文本块会被FittedBox居中放置，视觉上文本还是居中。
2. 外层套Align导致不缩放的原因：Align会为子组件（FittedBox）提供无限制的约束空间，FittedBox会直接采用Text的原始尺寸渲染，不会触发缩放逻辑。

解决方案 #

直接修改FittedBox的alignment属性为左对齐方向，同时保留BoxFit.contain的缩放效果：

ResizeableWidget(
  child: FittedBox(
    fit: BoxFit.contain,
    // 设置FittedBox的对齐方式为左对齐，根据需求可选Alignment.topLeft/centerLeft
    alignment: Alignment.centerLeft,
    child: Text(
      cardText,
      textAlign: TextAlign.left, // 确保文本自身内容左对齐（多行时生效）
      // 若为多行文本，可添加以下配置
      // maxLines: null,
      // softWrap: true,
    ),
  ),
)

效果说明 #

• BoxFit.contain会自动将文本缩放到ResizeableWidget能容纳的最大尺寸，同时保持文本比例
• alignment: Alignment.centerLeft会把缩放后的整个文本块左对齐放置，而非居中
• TextAlign.left确保文本内容在自身的边界内左对齐（比如多行文本的每一行都左对齐）

如果需要顶部左对齐（多行文本时顶部贴合），只需将alignment改为Alignment.topLeft即可。

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