颤振 |右对齐不起作用

Posted 2023-02-23

【中文标题】颤振 |右对齐不起作用

【英文标题】：FLUTTER | Right Align not working

【发布时间】：2018-11-11 09:40:29

【问题描述】：

试图将容器与文本视图子视图右对齐，它有一个位于另一列内的父行，尝试了 Stack Overflow 中的多种解决方案，但均无效。

代码

///Transactions Heading
        new Column(
         children: <Widget>[
            new Row(
              children: <Widget>[
                new Container(
                  alignment: Alignment.centerLeft,
                  margin: new EdgeInsets.only(top: 20.0, left: 10.0),
                  child: new Text(
                    "Transactions",
                    style: new TextStyle(
                      color: primaryTextColor,
                      fontSize: 25.0,
                      fontWeight: FontWeight.w700,
                      letterSpacing: 0.1,
                    ),
                  ),
                ),
                new Container(
                  margin: new EdgeInsets.only(top: 25.0),
                  child: new Text(
                    currentGoalTransactions.length.toString() + " items",
                    style: new TextStyle(
                        color: darkHeadingsTextColor, fontSize: 15.0),
                  ),
                ),
              ],
            ),
       ]);

想要将 2 项文本向右对齐

Screenshot

【问题讨论】：

你能分享一下你想要什么的图片吗？

【参考方案1】：

在 Row 小部件中使用 mainAxisAlignment 属性。

new Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween, 
    ...
)

【参考方案2】：

使用Spacer 将获得剩余空间并将小部件平均分配

     Row(
        children: <Widget>[
          Text("Text 1", style: TextStyle(fontSize: 20),),
          Spacer(),
          Text("Text 2", style: TextStyle(fontSize: 20),),
          Spacer(),
          Text("Text 3", style: TextStyle(fontSize: 20),),
        ],
      ),

输出：

【参考方案3】：

截图：

---

您也可以像这样尝试Wrap：

Wrap(
  spacing: 50, // spacing between each of the widgets below
  children: <Widget>[
    Text("One"),
    Text("Two"),
    Text("Three"),
  ],
)