将 ElevatedButton.icon 的图标定位到右侧答案

【问题标题】：position icon of ElevatedButton.icon to the right将 ElevatedButton.icon 的图标定位到右侧
【发布时间】：2021-11-22 04:58:05
【问题描述】：

我有一个带有图标的提升按钮，该图标使用ElevatedButton.icon 放置在文本左侧。我真正想要的是将图标放在文本的右侧。我该怎么做我的代码：

    ElevatedButton.icon(
        onPressed: onPressed,
        icon:Icon(icon,
          color: color != null ? color : null,
          size: getIconSize(),
        ),
        label: Text(label),
        style: buttonStyle);

它看起来如何：

我想要什么：

下一步 ->

【问题讨论】：

标签： flutter dart flutter-layout

【解决方案1】：

使用Directionality 小部件。制定方向rtl。

Directionality(
      textDirection: TextDirection.rtl,
      child: ElevatedButton.icon(
        onPressed: () {},
        icon: Icon(
          Icons.arrow_back,
        ),
        label: Text("Test"),
     //.........
      ))

现在，你只需要添加你的样式

【讨论】：

【解决方案2】：

您可以只使用常规的 ElevatedButton 构造函数并传入一个 Row 作为它的子元素，并带有您的图标和文本：

 ElevatedButton(
        onPressed: onPressed,
        style: buttonStyle,
        child: Row(mainAxisSize:MainAxisSize.min,
children:
[Text(label),
SizedBox.square(dimension: 4),
Icon(icon,color: color != null ? color : null,size: getIconSize()),
]),)

【讨论】：