flutter - 如何在Flutter中固定容器？

Question

我想将第一个容器固定在中间，将第二个容器固定在右边，但我做不到。我在行行中添加了mainAxisAlignment:MainAxisAlignment.spaceBetween，但是没有用。是否有其他属性可以调整小部件的位置？

我的代码:

new Container(
  width: 360,
  height: 502,
  decoration: new BoxDecoration(
    gradient: LinearGradient(
      colors: [
        Color(0xffffffff),
        Color(0x00caebfe) 
      ],
      stops: [0,1]
    )
  ),
  child:Column(
    //crossAxisAlignment: CrossAxisAlignment.start,
    children:<Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Container(
            alignment: Alignment.center,
            child: Text("JULY 2017",
              style: TextStyle(
                fontFamily: 'Baloo',
                color: Color(0xff181743),
                fontSize: 20,
                fontWeight: FontWeight.w400,
                fontStyle: FontStyle.normal,
              )
            )
          ),
          Container(
            alignment: Alignment.centerLeft,
            //padding: EdgeInsets.only(left:90.0),
            child: Column(
              children: <Widget>[
                new Container(
                width: 14,
                height: 5,
                decoration: new BoxDecoration(
                  borderRadius: BorderRadius.circular(10),
                  gradient: LinearGradient(
                    colors: [
                      Color(0xfffe1e9a),
                      Color(0xfffea64c) 
                    ],
                    stops: [0,1]
                  ),
                )
              ),
              new Container(
                //margin: EdgeInsets.only(top:3.0),
                width: 23,
                height: 5,
                decoration: new BoxDecoration(
                  borderRadius: BorderRadius.circular(10),
                  gradient: LinearGradient(
                    colors: [
                      Color(0xfffe1e9a),
                      Color(0xfffea64c) 
                    ],
                    stops: [0,1]
                  )
                )
              )
          ],)
          )
        ]
      )
    ]
  )
),

是否有其他属性可以调整小部件的位置？

Answer 1

按照您说的要实现的目标，例如使文本居中并完全向右倾斜，我通过在Expanded中第一个Container周围添加Row小部件并删除顶部Container的宽度来修改代码:

Container(
  height: 502,
  decoration: BoxDecoration(
    gradient: LinearGradient(
      colors: [
        Color(0xffffffff),
        Color(0x00caebfe)
      ],
      stops: [0,1]
    )
  ),
  child: Column(
    children:<Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          Expanded(
            child: Center(
              child: Text("JULY 2017",
                style: TextStyle(
                  fontFamily: 'Baloo',
                  color: Color(0xff181743),
                  fontSize: 20,
                  fontWeight: FontWeight.w400,
                  fontStyle: FontStyle.normal,
                )
              ),
            ),
          ),
          Column(
            children: <Widget>[
              new Container(
                width: 14,
                height: 5,
                decoration: new BoxDecoration(
                  borderRadius: BorderRadius.circular(10),
                  gradient: LinearGradient(
                    colors: [
                      Color(0xfffe1e9a),
                      Color(0xfffea64c)
                    ],
                    stops: [0,1]
                  ),
                )
              ),
              new Container(
                //margin: EdgeInsets.only(top:3.0),
                width: 23,
                height: 5,
                decoration: new BoxDecoration(
                  borderRadius: BorderRadius.circular(10),
                  gradient: LinearGradient(
                    colors: [
                      Color(0xfffe1e9a),
                      Color(0xfffea64c)
                    ],
                    stops: [0,1]
                  )
                )
              )
            ],)
        ]
      )
    ]
  )
),