Flutter Dart中如何让行末尾内容换行后靠右对齐？

你遇到的问题是因为WrapAlignment.spaceBetween仅在一行有多个子组件时生效，当按钮单独换行到第二行时，单个子组件会默认靠左排列。可以通过以下两种简单方式解决：

方案一：用Align包裹按钮 #

通过Align组件强制按钮始终靠右对齐，无论它在第一行还是换行后的第二行：

Wrap(
  direction: Axis.horizontal,
  alignment: WrapAlignment.spaceBetween,
  runSpacing: 8,
  children: [
    // 左侧文本区域保持不变
    FittedBox(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              const Icon(Icons.timer, size: 24, color: Color(0xFF4C4C4C)),
              const SizedBox(width: 8),
              Text(task.completeBy, style: textStyle),
            ],
          ),
          const SizedBox(height: 8),
          Row(
            children: [
              const Icon(Icons.remove_circle_outline, size: 24, color: Color(0xFF4C4C4C)),
              const SizedBox(width: 8),
              Text(task.getCompletionStatusText(), style: textStyle),
            ],
          ),
        ],
      ),
    ),
    // 用Align包裹按钮，确保始终靠右
    Align(
      alignment: Alignment.centerRight,
      child: statusButton,
    ),
  ],
)

方案二：用充满宽度的Container包裹按钮 #

如果更习惯使用Container，也可以设置容器宽度为最大，再将按钮右对齐：

// 替换原有的statusButton为以下代码
Container(
  width: double.infinity,
  alignment: Alignment.centerRight,
  child: statusButton,
)

原理说明 #

• 原代码中，当按钮单独占一行时，WrapAlignment.spaceBetween无法对单个子组件产生"左右分散"的效果，因此按钮会默认靠左。
• 用Align或Container包裹后，按钮会被强制在其可用空间内靠右排列，无论所在行有多少其他子组件，都能保持预期的对齐效果。

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