Flutter 中的单选按钮组件有两种。
1. Radio
单选按钮，一般用来表现一些简单的信息。
常用属性如下：
(1). value 单选的值；
(2). onChanged 选择改变触发的事件；
(3). activeColor 选中时的颜色；
(4). groupValue 多个按钮选择组的值；
2. RadioListTile
包含更多信息的单选项，提供多种配置信息的属性，可以表现更丰富的信息。
常用的属性如下：
(1). value 单选的值；
(2). onChanged 选择改变触发的事件；
(3). activeColor 选中时的颜色；
(4). groupValue 多个按钮选择组的值；
(5). title 标题；
(6). subtitle 副标题；
(7). secondary 次要的；
3. 代码示例
代码语言：javascript复制import 'package:flutter/material.dart';
class RadioPage extends StatefulWidget {
RadioPage({Key key}) : super(key: key);
@override
_RadioPageState createState() => _RadioPageState();
}
class _RadioPageState extends State<RadioPage> {
int sex = 1;
int status = 1;
bool flag = true;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Radio"),
),
body:Padding(
padding: EdgeInsets.all(20),
child:Column(
children: <Widget>[
// 简易选择项
Row(
children: <Widget>[
Text("男"),
Radio(
// 按钮的值
value: 1,
// 改变事件
onChanged: (value){
setState(() {
this.sex = value;
});
},
// 按钮组的值
groupValue:this.sex ,
),
SizedBox(width: 20,),
Text("女"),
Radio(
value:2,
onChanged: (value){
setState(() {
this.sex = value;
});
},
groupValue: this.sex,
),
],
),
// 组合选择项1
RadioListTile(
value:1,
groupValue:this.status,
onChanged:(value){
setState(() {
this.status = value;
});
},
title:Text("标题"),
subtitle:Text("这是二级标题"),
secondary:Icon(Icons.help),
selected:this.status == 1,
),
// 组合选择项2
RadioListTile(
value:2,
groupValue:this.status,
onChanged:(value){
setState(() {
this.status = value;
});
},
title:Text("标题"),
subtitle:Text("这是二级标题"),
secondary:Image.network('https://www.itying.com/images/flutter/1.png'),
selected:this.status == 2,
),
],
)
)
);
}
}效果图如下：
