我如何在行内居中小部件？答案

【问题标题】：how do i center widgets inside row?我如何在行内居中小部件？
【发布时间】：2019-12-28 16:04:22
【问题描述】：

所以我有这段代码，我尝试使用 center() 小部件，但我无法获取中心的元素，这是它们的外观。

有趣的是绿色容器占据了所有屏幕宽度，但容器内的小部件并未水平居中对齐。

这是代码

    Center(
        child: Container(
          color : Colors.green,
          alignment: Alignment(0.0, 0.0),
            child:  Row(
                children: <Widget>[
                    InkWell(
                        child: Text(
                            " Likes \n" + document['likes'].toString()),
                        onTap: () => LikeQuote(document),
                    ),
                    InkWell(
                        child: Text(" Dislikes \n" +
                            document['dislikes'].toString()),
                        onTap: () => DislikeQuote(document),
                    ),
                    InkWell(
                        child: Text(" Shares \n" +
                            document['shares'].toString()),
                        onTap: () => ShareQuote(),
                    ),
                ],
            ),
        ),
    ),

我希望喜欢的不喜欢和分享在中心。我该怎么做？

【问题讨论】：

在你的行中，尝试 mainAxisAlignment: MainAxisAlignment.center
How to centred column and row item in Flutter?的可能重复

标签： android flutter

【解决方案1】：

你应该使用mainAxisAlignment

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children:[ comp1(), comp2()

【讨论】：

我应该在哪里使用这个？
作为 Row 构造函数的属性，我已经更新了答案

【解决方案2】：

要在 Row 或 Columns 内对齐小部件，我们可以在 Row 或 Columns 内使用这些参数。

  mainAxisAlignment: MainAxisAlignment.center,              
  crossAxisAlignment: CrossAxisAlignment.center,

行：

mainAxisAlignment 确定水平对齐路径
crossAxisAlignment 确定垂直对齐路径

列：

mainAxisAlignment 确定垂直对齐路径
crossAxisAlignment 确定水平对齐路径

【讨论】：

好的，如果我希望它喜欢不喜欢并共享小部件以获得每个屏幕宽度的 33% 的宽度。
要使用百分比的高度和宽度，您可以使用 FractionallySizedBox 小部件。如果要填充行或列中的空白位置，可以为它们的子级使用 Expanded 小部件。 @TauseefAhmad

【解决方案3】：

Container(
          color : Colors.green,
          alignment: Alignment(0.0, 0.0),

          child:  Row(
             mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              InkWell(
                child: Text(
                    " Likes \n" + document['likes'].toString()),
                onTap: () => LikeQuote(document),
              ),
              InkWell(
                child: Text(" Dislikes \n" +
                    document['dislikes'].toString()),
                onTap: () => DislikeQuote(document),
              ),
              InkWell(
                child: Text(" Shares \n" +
                    document['shares'].toString()),
                onTap: () => ShareQuote(),
              ),
            ],
          )
          ,
        ),

【讨论】：