Flutter用Row实现左右布局的方式
这个代码中关键的是最外层的Container,大家知道通过mainAxisAlignment: MainAxisAlignment.spaceBetween设置成左右,但是发现不起作用
原因就是Row不知道外层空间的宽度,没法计算要撑开多宽,所以加上Container并指定一个宽度即可。
Container(
width: MediaQuery.of(context).size.width,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Padding(
padding: EdgeInsets.only(top:0,left: 0,right: 0,bottom: 0),
child:Row(
children: [
Text(
"111111",
textAlign:TextAlign.left,
style: TextStyle(
color: Color(0xffEB5405) ,
fontSize: 16,
fontWeight: FontWeight.w500
),
),
Text(
"2222222",
textAlign:TextAlign.left,
style: TextStyle(
color: Color(0xff999999) ,
fontSize: 12,
),
),
],
),
),
Padding(
padding: EdgeInsets.only(top:0,left: 0,right: 0,bottom: 0),
child:Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
IconButton(
icon: new Icon(Icons.remove_circle_outline_rounded),
color: Color(0xff999999),
onPressed: _minusCountAction,
iconSize: 20,
),
Text(
_count.toString(),
textAlign:TextAlign.center,
style: TextStyle(
color: Color(0xff222222) ,
fontSize: 18,
),
),
IconButton(
icon: new Icon(Icons.add_circle_outline_rounded),
color: Color(0xff999999),
onPressed: _addCountAction,
iconSize: 20,
),
],
),
),
]
),
),
本站内容来源于作者发布和网络转载,如有版权相关问题请及时与我们取得联系,我们将立即删除。