class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'FlatButton扁平化按钮', home: Scaffold( appBar: AppBar( title: Text('FlatButton扁平化按钮'), ), body: Column( children: [ //图标按钮 FlatButton.icon( onPressed: () {}, icon: Icon(Icons.print), label: Text('打印')), //文字按钮 FlatButton( //文本 child: Text( '点击登录', style: TextStyle(fontSize: 36.0), ), onPressed: () {}, //按钮背景色 color: Colors.green, //按钮亮度 colorBrightness: Brightness.dark, //失效背景色(失效状态即 onPressed为null ) disabledColor: Color.fromARGB(255, 0, 0, 0), //失效文字颜色(失效状态即 onPressed为null ) disabledTextColor: Colors.grey, //文字颜色 textColor: Colors.white, //按钮主题 ButtonTheme ButtonThemeData ButtonTextTheme ThemeData textTheme: ButtonTextTheme.normal, //墨汁飞溅的颜色、水波纹的颜色 splashColor: Colors.red, //抗锯齿能力 clipBehavior: Clip.antiAlias, //内边距 padding: EdgeInsets.only(bottom: 5.0, top: 5.0, left: 20, right: 20), //边框样式,矩形 // shape:Border.all( // width: 2.0, // color: Colors.green, // style: BorderStyle.solid // ), //圆角矩形样式 shape: RoundedRectangleBorder( side: BorderSide( width: 2.0, color: Colors.white, style: BorderStyle.solid), borderRadius: BorderRadius.only( topRight: Radius.circular(10.0), topLeft: Radius.circular(10.0), bottomLeft: Radius.circular(10.0), bottomRight: Radius.circular(10.0), )), ) ], ), )); } }
Flutter笔记11:FlatButton扁平化按钮
Flutter的button有:FloatingActionButton、IconButton、OutLineButton、FlatButton等,它们的很多属性和方法都是一样的,这篇文章是比较常用的FlatButton扁平化按钮,可以用来做图标按钮、普通文字按钮等: