Flutter中如何将TextButton的icon图标调整到右侧显示

你可以从以下三种适配不同场景的方案中选择：

• 方案1：直接调换icon和label的传值（适配所有Flutter版本）
  TextButton.icon的默认逻辑是固定将icon参数的组件放在label参数组件左侧，只要互换两个参数的传值即可实现图标右置，代码示例：

TextButton.icon(
  onPressed: onPressed,
  icon: text,
  label: Icon(
    Icons.arrow_open,
    color: companySelectionColor,
  ),
),

注意：如果原本的文字是带自定义样式的Text组件，直接把原label参数的Text组件整体移到icon参数即可。

• 方案2：使用iconAlignment参数（适配Flutter 3.10及以上版本）
  官方后续为TextButton.icon新增了图标对齐参数，无需调整原有参数，只需新增一行配置即可：

TextButton.icon(
  onPressed: onPressed,
  icon: Icon(
    Icons.arrow_open,
    color: companySelectionColor,
  ),
  label: text,
  // 新增此行配置即可实现图标右置
  iconAlignment: IconAlignment.end,
),

• 方案3：自定义子组件布局（灵活度最高，支持自定义间距、额外装饰）
  如果需要调整图标和文字的间距、或增加其他装饰元素，可以直接使用TextButton普通构造，自定义child的布局逻辑：

TextButton(
  onPressed: onPressed,
  child: Row(
    mainAxisSize: MainAxisSize.min,
    children: [
      text,
      const SizedBox(width: 8), // 8px为官方默认.icon构造的图标文字间距
      Icon(
        Icons.arrow_open,
        color: companySelectionColor,
      ),
    ],
  ),
)

预期效果参考：

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