- 四种按钮,文本默认按钮,有背景按钮,只有边框按钮,只有图标按钮
TextButton( child: Text('TextButton'), style: ButtonStyle( textStyle:MaterialStateProperty.all(TextStyle(fontSize: 16)), foregroundColor: MaterialStateProperty.all(Colors.black), //backgroundColor:MaterialStateProperty.all(Colors.green) ), onPressed: () {//onPressed: null,禁用按钮 BrnToast.show('单机',context); }, onLongPress: () { BrnToast.show('长按',context); }, ), ElevatedButton( child: Text('ElevatedButton'), style: ButtonStyle( textStyle:MaterialStateProperty.all(TextStyle(fontSize: 16)), foregroundColor: MaterialStateProperty.all(Colors.white), //backgroundColor:MaterialStateProperty.all(Colors.green) ), onPressed: () {//onPressed: null,禁用按钮 BrnToast.show('单机',context); }, onLongPress: () { BrnToast.show('长按',context); } ), OutlinedButton( child: Text('OutlinedButton按钮'), style: ButtonStyle( textStyle:MaterialStateProperty.all(TextStyle(fontSize: 16)), foregroundColor: MaterialStateProperty.all(Colors.black), //backgroundColor:MaterialStateProperty.all(Colors.green) side:MaterialStateProperty.all(BorderSide(width:1,color: Colors.green)) ), onPressed: () {//onPressed: null,禁用按钮 BrnToast.show('单机',context); }, onLongPress: () { BrnToast.show('长按',context); }, ), OutlinedButton.icon( icon: const Icon(Icons.keyboard_arrow_left), label: Text('图标按钮'), style: ButtonStyle( textStyle:MaterialStateProperty.all(TextStyle(fontSize: 16)), foregroundColor: MaterialStateProperty.all(Colors.black), //backgroundColor:MaterialStateProperty.all(Colors.green) side:MaterialStateProperty.all(BorderSide(width:1,color: Colors.green)) ), onPressed: () {//onPressed: null,禁用按钮 BrnToast.show('单机',context); }, onLongPress: () { BrnToast.show('长按',context); }, ), IconButton(icon: Icon(Icons.add), color: Colors.lightBlue, iconSize: 24, onPressed: () {//onPressed: null,禁用按钮 BrnToast.show('单机',context); } ) //开关两种 bool _switchSelected=true; //维护单选开关状态 bool _checkboxSelected=true;//维护复选框状态 Switch( value: _switchSelected,//当前状态 onChanged:(value){ //重新构建页面 print(value); setState(() { _switchSelected=value; }); }, ), SwitchListTile( title:Text('是否开启'), activeColor: Colors.green, activeTrackColor: Colors.green, value: _switchSelected,//当前状态 onChanged:(value){ //重新构建页面 print(value); setState(() { _switchSelected=value; }); }, ), Checkbox( value: _checkboxSelected, activeColor: Colors.red, //选中时的颜色 onChanged:(value){ print(value); setState(() { _checkboxSelected=value!; }); } , ), CheckboxListTile( title:Text('是否开启'), //controlAffinity: ListTileControlAffinity.leading,//勾选在前,默认在后面 activeColor: Colors.green, subtitle: Text('描述'), secondary: Icon(Icons.person), value: _checkboxSelected, onChanged:(value){ print(value); setState(() { _checkboxSelected=value!; }); } , ), 单选 var _radioGroupValue = '语文';//默认值 RadioListTile( title: Text('语文'), value: '语文', groupValue: _radioGroupValue, onChanged: (value) { setState(() { _radioGroupValue = value!; }); }, ), 滑块 RangeValues _rangeValues = RangeValues(0, 20); double _sliderValue = 0; RangeSlider( values: _rangeValues, labels: RangeLabels('${_rangeValues.start}','${_rangeValues.end}'), min: 0, max: 100, divisions: 100, onChanged: (v) { setState(() { _rangeValues = v; }); }, ), Slider( value: _sliderValue, label: '$_sliderValue', min: 0, max: 100, divisions: 100, onChanged: (v){ setState(() { _sliderValue = v; }); }, ) 线性和圆形进度条 LinearProgressIndicator( value: 0.3,//长度0-1之间 backgroundColor:Colors.grey,//背景色 valueColor: AlwaysStoppedAnimation<Color>(Colors.green),//进度色 ), CircularProgressIndicator( value: 0.3, backgroundColor: Colors.grey, valueColor: AlwaysStoppedAnimation<Color>(Colors.green), ) 图片图标,前面一定要有空格 assets: - assets/images/ Image.asset('assets/images/1.webp',width: 100,height: 200,fit:BoxFit.cover), Image.network("http://pic1.win4000.com/pic/c/cf/cdc983699c.jpg",width: 200,height: 200,fit:BoxFit.cover),//充满宽高 Image.memory(base64Decode("")),//图片base64,需要import 'dart:convert';
作者:Yoby 创建时间:2022-11-15 13:47
更新时间:2024-12-05 13:26
更新时间:2024-12-05 13:26