Flutter中Row中的子控件左右两端对齐
代码语言:javascript
复制Container(
// padding: EdgeInsets.only(left: 20, right: 20),
margin: EdgeInsets.only(top: 20, left: 20, right: 20),
width: 500,
height: 500,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5), color: Colors.blue),
child: Column(
children: [
//第一种 利用expanded
Container(
color: Color(0xFFF6F6F6),
height: 50,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("名称"),
Expanded(
child: Container(
alignment: Alignment.topRight,
child: Text("Expanded")),
)
],
),
),
//第二种用 row 的熟悉属性
Container(
color: Color(0xFFF6F6F6),
height: 50,
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
new Text("名称"),
new Text("spaceBetween"),
],
),
),
//第三种 spacer
Container(
child: new Row(
children: [
new Text("名称"),
Spacer(),
new Text("Spacer"),
],
),
),
// //第四种 Flexible
Container(
child: new Row(
children: [
new Text("名称"),
Flexible(fit: FlexFit.tight, child: SizedBox()),
new Text("Flexible"),
],
),
),
],
),
)