Question

默认情况下，居中小部件将其子对象居中并居中。但就我而言，它不起作用。
我想将包含多行的列居中，以便我们说唱我们在中心小部件中的列。
中心小部件应将列作为子级并将其居中。但是其行为异常。

这是我的代码


        child: Column(
        
          children: <Widget>[

            Row(
              children: <Widget>[
                //This is widget 1

                Expanded(
                  child: Text(
                    "Spice Jet",
                    textDirection: TextDirection.ltr,
                    style: TextStyle(
                      decoration: TextDecoration.none,
                      fontFamily: 'Raleway',
                      fontSize: 35.0,
                      color: Colors.white,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ),
                //This is widget 2

                Expanded(
                  child: Text(
                    "From Mubabi to Banglore via New dehli",
                    textDirection: TextDirection.ltr,
                    style: TextStyle(
                      decoration: TextDecoration.none,
                      fontFamily: 'Raleway',
                      fontSize: 20.0,
                      color: Colors.white,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ),
              ],
            ),

            
            Row(
              children: <Widget>[
                //This is widget 1

                Expanded(
                  child: Text(
                    "Air India",
                    textDirection: TextDirection.ltr,
                    style: TextStyle(
                      decoration: TextDecoration.none,
                      fontFamily: 'Raleway',
                      fontSize: 35.0,
                      color: Colors.white,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ),
                //This is widget 2
                Expanded(
                  child: Text(
                    "From Jaipur to Goa",
                    textDirection: TextDirection.ltr,
                    style: TextStyle(
                      decoration: TextDecoration.none,
                      fontFamily: 'Raleway',
                      fontSize: 20.0,
                      color: Colors.white,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

output of this code on emulator

Answer 1

尝试使用轴对齐方式。

对于行

mainAxisAlignment: MainAxisAlignment.center

对于列

crossAxisAlignment: CrossAxisAlignment.center

Answer 2

默认情况下，行的crossAxisAlignment居中。但是当您将其包装成一列时，它没有出现在中心，因为它具有默认的crossAxisAlignment作为开始而不是中心。您将必须手动添加以下行：

crossAxisAlignment: CrossAxisAlignment.center

您的代码应如下所示：

....
color: Colors.deepPurple,
    child: Column(
    crossAxisAlignment: CrossAxisAlignment.center
      children: <Widget>[

        Row(
          children: <Widget>[....

希望有帮助！编码愉快：）

中心小部件作为父级的行为如何？

2 个答案: