如何解决通过循环渲染复选框
void filterList(BuildContext context) {
showModalBottomSheet(
context: context,builder: (bContext) {
return FilterList();
},);
}// creating a bottom modal sheet
class FilterList extends StatefulWidget {
@override
_FilterListState createState() => _FilterListState();
}//creating a state for checkboxes
class _FilterListState extends State<FilterList> {
int i;
bool checkvalue = false;
Widget _element(String id) {
return Row(
children: <Widget>[
Checkbox(
value: checkvalue,onChanged: (value) {
setState(
() {
checkvalue = value;
},);
},),Text('$id')
],);
}// A new Widget where I get to combine the checkboxes with their respective texts
@override
Widget build(BuildContext context) {
return ListView(
children: <Widget>[for (i = 10; i <= 120; i = i + 10) _element('$i HP')],// for loop for iterating the widget rendering
//HP stands for horsepower...
);
}
}
因此,我尝试在底部模式表内创建过滤器UI时使用“ for循环”渲染复选框。在这里,当我尝试更改一个复选框的状态时,所有其他复选框也都更改了它们的状态。有没有一种方法可以保留for循环,但是仅更改所选复选框的状态?或者,我是否必须放弃循环并一直进行硬编码?
解决方法
您需要将所有checkvalue
存储在List
中:
class FilterList extends StatefulWidget {
@override
_FilterListState createState() => _FilterListState();
} //creating a state for checkboxes
class _FilterListState extends State<FilterList> {
int i;
List<bool> checkvalue = new List<bool>.filled(12,false); // this is new
Widget _element(String id,int index) { // index added
return Row(
children: <Widget>[
Checkbox(
value: checkvalue[index],// [index] added
onChanged: (value) {
setState(
() {
checkvalue[index] = value; // [index] added
},);
},),Text('$id')
],);
} // A new Widget where I get to combine the checkboxes with their respective texts
@override
Widget build(BuildContext context) {
return ListView(
children: <Widget>[
for (i = 10; i <= 120; i = i + 10) _element('$i HP',i ~/ 10 - 1) // index added
],// for loop for iterating the widget rendering
//HP stands for horsepower...
);
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。