Row实现行布局
通过 Expanded 实现灵活布局
Row 默认等于父容器的宽度
可以理解为 Row 是前端的 flex 布局， Expanded 是 flex 布局中的 flex:1; 属性值
new Container(
child: new Row(
children: <Widget>[
Expanded(
child: new Container(
child: new Text('剩下都是我的')
)
),
new RaisedButton(
onPressed: (){
print('object');
},
color: Colors.limeAccent,
child: new Text('按钮'),
),
],
),
width: 200.0,
color: Colors.lightGreen
)
效果如图
Column 实现列布局
Center(
// 宽度因子 当前Center的宽度是 子元素的 widthFactor 倍数
widthFactor: 2.0,
// 高度因子 当前Center的高度是 子元素的 heightFactor 倍数
heightFactor: 1.0,
child: new Container(
child: Column(
// Column 元素的横向对齐情况
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
Text('1'),
Text('22222'),
Text('3'),
],
),
width: 200.0,
height: 300.0,
color: Colors.lightGreen
),
)
