flutter - RadioListTile 未正确选择
问题描述
我是 Vaibhav Pathak。我在使用 RadioListTile 时遇到问题。我在 onChnaged 属性上创建了两个 RadioListTile 来调用一个函数,在该函数中调用 setState 将 selectedRadio 变量的值设置为我从函数中获得的值,它更改了变量值但不反映对 Ui 的更改意味着它确实不选择按下的单选按钮。
我的代码在这里:
showPaymentOptions() {
showModalBottomSheet(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25.0),
topRight: Radius.circular(25.0))),
elevation: 8.0,
context: context,
builder: (context) {
return Padding(
padding: const EdgeInsets.all(15.0),
child: Container(
height: 240,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Column(
children: <Widget>[
Align(
alignment: Alignment.topLeft,
child: Text(
"Select Payment Method : ",
style: TextStyle(
color: Colors.black54,
fontSize: 16.0,
fontWeight: FontWeight.bold),
),
),
SizedBox(
height: 7.0,
),
Card(
elevation: 8.0,
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Column(
children: <Widget>[
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("COD"),
value: 1,
groupValue: selectedPaymentMethod,
onChanged: (value) =>
_changePayment(value)),
SizedBox(
height: 5.0,
),
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("Paytm"),
value: 2,
groupValue: selectedPaymentMethod,
onChanged: (value) =>
_changePayment(value)),
],
),
),
),
],
),
Padding(
padding: const EdgeInsets.all(10.0),
child: Stack(
alignment: Alignment.bottomCenter,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"Pay ₹499",
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold),
),
isOrderSuccessful
? RaisedButton(
onPressed: () =>
placeOrder(selectedPaymentMethod),
color: myTheme.primaryColor,
textColor: Colors.white,
child: Text(
"Place Order",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16.0),
))
: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(
myTheme.primaryColor))
],
),
],
),
)
],
)),
);
});
}
setState 函数代码:
_changePayment(int value) {
print(value);
print(selectedPaymentMethod);
setState(() {
selectedPaymentMethod = value;
});
}
解决方案
朋友我自己做的。我使用了StatefulBuilder
小部件并将列子项包裹在Column
我放入两个子项的内部,ReadioListTile
并在 onChanged 属性中放入了_setState
我从构建器获得StatefulBuilder
的值并将支付方式变量的值设置为其值,然后它以我的方式正常工作想要它。
答案代码:
StatefulBuilder(
builder: (context, _setState) {
return Column(
children: <Widget>[
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("Cash on Delivery"),
value: 1,
groupValue: selectedPaymentMethod,
onChanged: (value) => _setState(() {
selectedPaymentMethod = value;
})),
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("Paytm"),
value: 2,
groupValue: selectedPaymentMethod,
onChanged: (value) => _setState(() {
selectedPaymentMethod = value;
})),
],
);
},
),
推荐阅读
- bash - BASH:如何使用 echo 命令计算小数?
- php - 如何通过在codeignter中通过ajax jquery单击boostrap模型中的数据库中的查看详细信息来显示图像
- r - 从 R 中的 scale::percent() 中删除百分比符号
- javascript - 使用 async / await 仍然返回 undefined
- java - Java OpenCV 保存视频文件
- plugins - Confluence 插件:如何从导入的 CSV 以编程方式创建空间和页面?
- javascript - 如何替换对象的深层值?
- excel - 引用 Outlook 库会生成“已使用的模块、项目或库的名称”
- python - 列表输入的 Python 验证正在跳过无效索引?
- c - 如何在 C 中生成一个随机且唯一的整数数组?