我有两个用于注册表单的单选按钮,我希望它们水平相邻,我已经使用 Row
完成了,但是随附的文本不会选择单选按钮,只会选择单选按钮本身就是这样做的……
我知道 RadioListTile 允许单选按钮和标签,但据我所知它只能垂直定位。将 Text
包裹在 InkWell 中可能可行,但我不确定如何保存状态。
Row(
children: <Widget>[
Row(
children: <Widget>[
Radio(
value: 0,
groupValue: _radioGroupValue,
activeColor: Colors.white,
onChanged: (int value) {
changeRadioSelection(value);
}),
Text(
'Client',
style: TextStyle(color: Colors.white, fontSize: 15.0),
)
],
),
SizedBox(
width: 20.0,
),
Row(
children: <Widget>[
Radio(
value: 1,
groupValue: _radioGroupValue,
onChanged: (int value) {
changeRadioSelection(value);
},
activeColor: Colors.white,
),
Text(
'Customer',
style: TextStyle(color: Colors.white, fontSize: 15.0),
)
],
)
],
),
状态控制方法:
void changeRadioSelection(int value) {
setState(() {
_radioGroupValue = value;
print('Radio butto selected: $value');
});}
除了文本没有选择单选按钮外,这工作正常。有没有办法做到这一点。如果我的 UI 水平放置而不是垂直放置,它看起来会更干净。
最佳答案
两种解决方案:
- 要么使用RadioListTile
- 或将 Row 换行到 inkWell(或任何其他可点击的小部件)
InkWell(
onTap: () => changeRadioSelection(1),
child: Row(
children: <Widget>[
Radio(
value: 1,
groupValue: _radioGroupValue,
onChanged: (int value) {
changeRadioSelection(value);
},
activeColor: Colors.grey,
),
Text(
'Customer',
style: TextStyle(color: Colors.black, fontSize: 15.0),
)
],
),
)
关于flutter - 如何使单选按钮文本可点击?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57360790/