Flutter 如何使行文本居中

您好，我想问一下如何使文本进入中心。 我有一行包含2个文本。 下面是我的代码

Container(
        child: Padding(
          padding: const EdgeInsets.only(bottom: 60.0),
          child: Center(
            child: Row(
              children: [
                Text(
                  "Great",
                  style: TextStyle(
                      color: Colors.white,
                      fontSize: 44.0,
                      fontWeight: FontWeight.w700,
                      fontFamily: "Berlin"),
                ),
                Text(
                  "Ocean",
                  style: TextStyle(
                      color: Colors.blue,
                      fontSize: 44.0,
                      fontWeight: FontWeight.w700,
                      fontFamily: "Berlin"),
                ),
              ],
            ),
          ),
        ),
      ),

代码的输出是这样的

---

如何使该行居中？

有几种方法可以实现这一点，但首先，我想重构您的代码。您正在

容器

小部件中使用

填充

，这是完全不必要的，因为

容器

小部件已经有一个名为

填充

的属性。因此，您应该删除

填充

小部件

此外，您还使用了

容器内的
居中
小部件，这也是不必要的，因为
容器
具有
对齐
属性，您可以使用该属性来居中对齐子小部件（
对齐.居中
）

最后，为了将
行
小部件中的子小部件居中对齐，有
mainAxisAlignment
&
crossAxisAlignment
属性可用于对齐小部件

将
mainAxisAlignment
设置为
mainAxisAlignment.center
将使所有子部件居中

此外，您还使用了两个不同的
Text
小部件来创建不同样式的
Text
小部件，您可以使用单个
RichText
小部件来实现


您的最终代码应该如下所示：

return Container(
  padding: const EdgeInsets.only(bottom: 60.0),
  alignment: Alignment.center,
  child: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      RichText(
        text: TextSpan(
          style: TextStyle(
              color: Colors.white,
              fontSize: 44.0,
              fontWeight: FontWeight.w700,
              fontFamily: "Berlin"),
          text: "Great",
          children: <TextSpan>[
            TextSpan(
              text: 'Ocean',
              style: TextStyle(
                  color: Colors.blue,
                  fontSize: 44.0,
                  fontWeight: FontWeight.w700,
                  fontFamily: "Berlin"),
            ),
          ],
        ),
      ),
    ],
  ),
);

返回容器(
填充：仅限常量边集（底部：60.0），
对齐：对齐.center，
孩子：排(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
RichText(
text:TextSpan(
样式：TextStyle(
颜色：颜色，白色，
字体大小：44.0，
fontWeight:fontWeight.w700，
fontFamily：“柏林”），
文字：“太好了”，
儿童：[
TextSpan(
文字：“海洋”，
样式：TextStyle(
颜色：颜色，蓝色，
字体大小：44.0，
fontWeight:fontWeight.w700，
fontFamily：“柏林”），
),
],
),
),
],
),
);
使用行中的属性<代码>MainAxisAlignment.center

删除中心并使用行中的MainAxisAlignment属性。main.center谢谢你们，真的谢谢你们。它起作用了