Button( style: ButtonStyle( backgroundColor: WidgetStateProperty.all(Colors.blue),// 背景颜色foregroundColor: WidgetStateProperty.all(Colors.white),// 文本颜色side: WidgetStateProperty.all(constBorderSide( width:2, color: Colors.red,// 边框颜色) ) ), child:constText("Custom OutlineButton"), ...
在Flutter 里有很多的 Button,包括了:MaterialButton、RaisedButton、FloatingActionButton、FlatButton、IconButton、ButtonBar、DropdownButton 等。 一般常用的 Button 是 MaterialButton、IconButton、FloatingActionButton。 MaterialButton是一个 Materia 风格的按钮。 newMaterialButton( color: Colors.blue, textColor: Co...
OutlineButton( borderSide: BorderSide(color: Colors.blue,width: 2), disabledBorderColor: Colors.black, highlightedBorderColor: Colors.red, child: Text('Button'), onPressed: () {}, ) 效果如下: DropdownButton DropdownButton为下拉选择按钮,基本用法如下: var _dropValue = '语文'; _buildButton()...
但是,我们可以分别使用 color 和 textColor 属性对按钮和文本使用 color。 按钮的颜色是蓝灰色,Splash 的颜色是粉红色 FlatButton( splashColor: Colors.pink, color: Colors.blueGrey, textColor: Colors.white, minWidth: MediaQuery.of(context).size.width / 2, height: 45, shape: RoundedRectangleBorder(bord...
3.6、OutlineButton 外边框按钮,可设置按钮外边框颜色。 示例见图二。 代码语言:javascript 复制 OutlineButton(child:Text("OutlineButton"),borderSide:newBorderSide(color:Colors.pink),onPressed:(){},), 3.7、ButtonBar 水平布局的按钮容器,可放置多个Button或Text。 示例见图一。
OutlineButton 是一个带边框的按钮,用法和RaisedButton一样,代码如下: 代码语言:javascript 复制 OutlineButton(child:Text('Button'),onPressed:(){},) 效果如下: 设置其边框样式,代码如下: 代码语言:javascript 复制 OutlineButton(borderSide:BorderSide(color:Colors.blue,width:2),disabledBorderColor:Colors.black...
color: Colors.white, border:Border.all(color:Color(0xffFF4B38), width:1), ), child:Text('否', style:TextStyle( color:Color(0xffFF4B38), fontSize:17)), ), ), ), Expanded( flex:3, child:FlatButton( onPressed: (){ widget.confirmCallback(''); ...
all(Size(320, 36)), //设置阴影 不适用于这里的TextButton elevation: MaterialStateProperty.all(0), //设置按钮内边距 padding: MaterialStateProperty.all(EdgeInsets.all(10)), ///设置按钮圆角 shape: MaterialStateProperty.all(RoundedRectangleBorder( borderRadius: BorderRadius.circular(5))), ///...
icon小图标按钮只有IconButton才会使用到 ---扩展--- 1.1带斜角的按钮 shape: BeveledRectangleBorder( borderRadius: BorderRadius.all(Radius.circular(20)) ), 1.2圆按钮 shape: CircleBorder( // 圆边颜色 side: BorderSide( color: Colors.black
下面带大家一起看看Flutter如何实现圆角按钮和圆形按钮 圆角按钮 ElevatedButton(style:ButtonStyle(backgroundColor:MaterialStateProperty.all(Colors.blue),foregroundColor:MaterialStateProperty.all(Colors.white),elevation:MaterialStateProperty.all(20),shape:MaterialStateProperty.all(RoundedRectangleBorder(borderRadius:...