class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'ButtonBar末端对齐按钮容器',
home: Scaffold(
appBar: AppBar(
title: Text('ButtonBar末端对齐按钮容器'),
),
body: Column(children: [
ButtonBar(
//排列方式
alignment: MainAxisAlignment.end,
mainAxisSize: MainAxisSize.min,
children: [
RaisedButton(
onPressed: () {},
child: Text('按钮'),
color: Colors.yellowAccent),
RaisedButton(
onPressed: () {},
child: Text('按钮'),
color: Colors.yellowAccent),
RaisedButton(
onPressed: () {},
child: Text('按钮'),
color: Colors.yellowAccent),
RaisedButton(
onPressed: () {},
child: Text('按钮'),
color: Colors.yellowAccent),
],
),
ButtonBar(
alignment: MainAxisAlignment.end,
mainAxisSize: MainAxisSize.max,
children: [
Container(
width: 50.0,
height: 50.0,
color: Colors.black,
),
Container(
width: 50.0,
height: 50.0,
color: Colors.black,
),
Container(
width: 50.0,
height: 50.0,
color: Colors.black,
)
],
)
]),
));
}
} Flutter笔记16:ButtonBar末端对齐按钮容器
ButtonBar末端对齐按钮容器有点类似于CSS3中的flex容器,能够通过alignment对子元素进行排列。ButtonBar主要对按钮进行排列,当然,如果要对其他容器,如Container等进行排列,也可以
