class MyApp extends StatelessWidget { const MyApp({Key key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( title: 'Expanded和Flexible组件', home: Scaffold( appBar: AppBar( title: Text('Expanded和Flexible组件'), ), body: Row( children: [ RaisedButton( color: Colors.orange, child: Text('橙色的按钮'), //此属性为null或者不写,则按钮为禁用状态,上面的颜色设置将无效 onPressed: () {}, ), // //Expanded填充两个按钮之间的空间 // Expanded( // //填充剩余空间,将两边的按钮撑开 // flex: 1, // child: RaisedButton( // color: Colors.pink, // child: Text('粉色的按钮'), // //此属性为null或者不写,则按钮为禁用状态,上面的颜色设置将无效 // onPressed: () {}, // ), // ), //Flexible填充两个按钮之间的空间 Flexible( //Flexible加了此属性也无效,还是没有撑开剩余空间 flex: 1, child: RaisedButton( color: Colors.pink, child: Text('粉色的按钮'), //此属性为null或者不写,则按钮为禁用状态,上面的颜色设置将无效 onPressed: () {}, ), ), RaisedButton( color: Colors.red, child: Text('红色的按钮'), //此属性为null或者不写,则按钮为禁用状态,上面的颜色设置将无效 onPressed: () {}, ), ], ), ), ); } }
Flutter笔记23:Expanded和Flexible组件
Expanded和Flexible组件都是填充组件,都是配合Row或Column或Flex组件使用,决定剩下的空间如何分配,Expanded会将剩下的空间填充完,但Flexible不会