Flutter Radio,RadioListTile以及Switch开关
程序员文章站
2022-05-30 19:36:42
...
Radio
import 'package:flutter/material.dart';
class RadioDemo extends StatefulWidget {
@override
_RadioDemoState createState() => _RadioDemoState();
}
class _RadioDemoState extends State<RadioDemo> {
var sex=1;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Title'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('男:'),
Radio(value: 1, groupValue: sex, onChanged: (v){
setState(() {
this.sex=v;
});
}),
Text('女:'),
Radio(value: 2, groupValue: sex, onChanged: (v){
setState(() {
this.sex=v;
});
}),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(sex==1?'男':'女')
],
)
],
),
);
}
}
import 'package:flutter/material.dart';
class RadioDemo extends StatefulWidget {
@override
_RadioDemoState createState() => _RadioDemoState();
}
class _RadioDemoState extends State<RadioDemo> {
var sex=1;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Title'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RadioListTile(
value: 1,
onChanged: (v){
setState(() {
this.sex=v;
});
},
title: Text('Title'),
subtitle: Text('subtitle'),
selected: this.sex==1,//文字也选中
groupValue: this.sex,
),
RadioListTile(
value:2,
onChanged: (v){
setState(() {
this.sex=v;
});
},
title: Text('Title02'),
subtitle: Text('subtitle02'),
groupValue: this.sex,
selected: this.sex==2,//文字也选中
secondary: Image.network('http://5b0988e595225.cdn.sohucs.com/images/20171108/d29a69f9c7fc41d1aae4516df8ebfac3.jpeg',height: 60,width: 60,),
)
],
),
);
}
}
Switch
import 'package:flutter/material.dart';
class RadioDemo extends StatefulWidget {
@override
_RadioDemoState createState() => _RadioDemoState();
}
class _RadioDemoState extends State<RadioDemo> {
var flag=true;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Title'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Switch(
value: this.flag,
onChanged: (v){
setState(() {
this.flag=v;
});
},
)
],
)
],
),
);
}
}
上一篇: 如何通过Bit-Z的场外交易购买BZ?(新手图文攻略)
下一篇: 模拟电子的开端之半导体
推荐阅读
-
X-admin2.2中switch开关的监听,以及属性值获取和更改状态等操作
-
Flutter之CupertinoSwitch和Switch开关组件的简单使用
-
Flutter Radio,RadioListTile以及Switch开关
-
Flutter 组件之表单组件TextField、CheckBox、Radio、Switch
-
flutter 单选框按钮组件Radio、单选框卡片组件 RadioListTile、开关组件Switch、开关卡片组件SwitchListTile
-
如何利用用CSS3美化单选框 radio 、多选框 checkbox 和 switch开关按钮
-
如何利用用CSS3美化单选框 radio 、多选框 checkbox 和 switch开关按钮
-
《Flutter 控件大全》第七十二:Radio 和RadioListTile
-
Flutter实现多行文本框、开关按钮、多选框、单选按钮、RadioListTile、Radio、表单