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

Question

我有一个带有图标的提升按钮，其中使用

ElevatedButton.icon

将图标放置在文本左侧。我真正想要的是将图标放置在文本的右侧。我该怎么做 我的代码：

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

看起来如何：

我想要什么：

下一页 ->

Answer 1

使用

Directionality

小部件。确定方向

rtl

。

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

现在，您只需添加您的风格

Answer 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()),
]),)

Answer 3

您只需将此属性添加到按钮即可：

iconAlignment: IconAlignment.end,

将图标放置在按钮的末尾。