Flutter 中 实现 单选对话框 和页面中实现单选框


showDispatchDialog(List<Technician> techList) async {
var alertDialogs = await showDialog(
context: context,
builder: (context) {
int _techIndex = 0;
return AlertDialog(
title: Text("请选择"),
content: StatefulBuilder(builder: (context, StateSetter setState) {
return SingleChildScrollView(
child: ListBody(
children: techList.asMap().keys.map((index) =>
Padding(
padding:EdgeInsets.all(5),
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Radio(
value: index,
groupValue: _techIndex,
onChanged: (v) {
setState(() {
this.technician = techList[v];
_techIndex = v;
});
},
),
Text(techList[index].name),
],
)
)
).toList(),
),
);
}),


actions: <Widget>[
FlatButton(
child: Text("取消"),
onPressed: () {
Navigator.pop(context, "cancel");} ),
FlatButton(
child: Text("确定"),
onPressed: (){
Navigator.pop(context, "confirm");

}),
],
);
});
}




页面中实现单选框

///默认选中的单选框的值
int groupValue = 0;
///单选框的成组使用
Row buildRadioGroupRowWidget() {
return Row(
children: [
Row(
///包裹子布局
mainAxisSize: MainAxisSize.min,
children: [
Radio(
///此单选框绑定的值 必选参数
value: 0,
///当前组中这选定的值 必选参数
groupValue: groupValue,
///点击状态改变时的回调 必选参数
onChanged: (v) {
setState(() {
this.groupValue = v;
});
},
),
Text("语文")
],
),
Row(
///包裹子布局
mainAxisSize: MainAxisSize.min,
children: [
Radio(
///此单选框绑定的值 必选参数
value: 1,
///当前组中这选定的值 必选参数
groupValue: groupValue,
///点击状态改变时的回调 必选参数
onChanged: (v) {
setState(() {
this.groupValue = v;
});
},
),
Text("数学")
],
),
Row(
///包裹子布局
mainAxisSize: MainAxisSize.min,
children: [
Radio(
///此单选框绑定的值 必选参数
value: 2,
///当前组中这选定的值 必选参数
groupValue: groupValue,
///点击状态改变时的回调 必选参数
onChanged: (v) {
setState(() {
this.groupValue = v;
});
},
),
Text("英语")
],
),
],
);
}
原文地址:https://www.cnblogs.com/lucktian/p/13862380.html