我正在尝试创建一个包含3个单选按钮的性别选择功能。我已经完成了这段代码,但是它并没有按照我想要的方式工作。
单选按钮容器
final _radio_colume_container = Container(
margin: const EdgeInsets.fromLTRB(50, 15, 50, 00),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
'Gender*',
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
add_radio_button(0, 'Male'),
add_radio_button(1, 'Female'),
add_radio_button(2, 'Others'),
],
),
],
),
);
add_radio_button方法
Row add_radio_button(int btnValue, String title) {
return Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Radio(
activeColor: Colors.green,
value: btnValue,
groupValue: -1,
onChanged: _handleradiobutton,
),
Text(title)
],
);
}
我正在实现]
我想实现这一目标。
我正在尝试创建一个包含3个单选按钮的性别选择功能。我已经完成了这段代码,但是却无法正常运行。单选按钮容器最终_radio_colume_container = ...
您应该看一下RadioListTile
,因为它提供了dense
属性,这将有助于减少按钮与其标题之间的填充。
List gender=["Male","Female","Other"];
String select;
Row addRadioButton(int btnValue, String title) {
return Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Radio(
activeColor: Theme.of(context).primaryColor,
value: gender[btnValue],
groupValue: select,
onChanged: (value){
setState(() {
print(value);
select=value;
});
},
),
Text(title)
],
);
}
//Use the above widget where you want the radio button
child: Row(
children: <Widget>[
addRadioButton(0, 'Male'),
addRadioButton(1, 'Female'),
addRadioButton(2, 'Others'),
],
),