ListView ListTile 开关在 Flutter 中同时切换
ListView ListTile Switches toggle simultaneously in Flutter
我有一个 ListView
的 ListTile
,尾随 Switch
。我的问题是当我切换任何开关时,其他开关也会切换,尽管它们不应该切换。
外观如下:
这是代码(去除了混乱):
//Schedule program class
class ScheduleProgram {
bool enabled;
bool isStart;
TimeOfDay time;
int duration;
List<bool> dow;
ScheduleProgram(
{this.enabled, this.isStart, this.time, this.duration, this.dow});
}
//Init list of programs
List<ScheduleProgram> scheduleList =
List<ScheduleProgram>.filled(10,
ScheduleProgram(
enabled: false,isStart: false,time: TimeOfDay(minute: 0, hour: 0),
duration: 0,dow: [false, false, false, false, false, false, false]),
growable: false );
...
//And now build the list
int _selectedProgramIndex = 0;
ListView _generateTaskButtonList(BuildContext context) {
return ListView.separated(
separatorBuilder: (BuildContext context, int index) {
return SizedBox(height: 10);
},
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
return ClipRRect(
child: ListTile(
selected: index == _selectedProgramIndex,
leading: IconButton(
icon: const Icon(Icons.edit, size: 30),
onPressed: () {
setState(() {
log("Edit $index pressed");
});
},
),
title: Text('P' + index.toString() + ':'),
subtitle: Text('-'),
trailing: Padding(
child: Transform.scale(
child: Switch(
onChanged: (v) {
setState(() {
scheduleList[index].enabled = v;
log("P$index is $v, scheduleList enabled = " +
scheduleList[index].enabled.toString());
});
},
value: scheduleList[index].enabled,
),
),
),
onTap: () {
log('Tapped #' + index.toString());
setState(() {
_selectedProgramIndex = index;
});
},
),
);
},
);
}
}
发生这种情况是因为 List.filled()
创建了一个列表,其中所有元素实际上都使用同一个对象。换句话说,您的 scheduleList 一遍又一遍地具有相同的对象,而不是不同的对象。要为每个索引创建一个新对象,请改用 List.generate()
。
只需用此替换您的 //Init list of programs
代码即可:
//Init list of programs
List<ScheduleProgram> scheduleList = List<ScheduleProgram>.generate(
10,
(index) => ScheduleProgram(
enabled: false,
isStart: false,
time: TimeOfDay(minute: 0, hour: 0),
duration: 0,
dow: [false, false, false, false, false, false, false]),
growable: false);
我有一个 ListView
的 ListTile
,尾随 Switch
。我的问题是当我切换任何开关时,其他开关也会切换,尽管它们不应该切换。
外观如下:
这是代码(去除了混乱):
//Schedule program class
class ScheduleProgram {
bool enabled;
bool isStart;
TimeOfDay time;
int duration;
List<bool> dow;
ScheduleProgram(
{this.enabled, this.isStart, this.time, this.duration, this.dow});
}
//Init list of programs
List<ScheduleProgram> scheduleList =
List<ScheduleProgram>.filled(10,
ScheduleProgram(
enabled: false,isStart: false,time: TimeOfDay(minute: 0, hour: 0),
duration: 0,dow: [false, false, false, false, false, false, false]),
growable: false );
...
//And now build the list
int _selectedProgramIndex = 0;
ListView _generateTaskButtonList(BuildContext context) {
return ListView.separated(
separatorBuilder: (BuildContext context, int index) {
return SizedBox(height: 10);
},
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
return ClipRRect(
child: ListTile(
selected: index == _selectedProgramIndex,
leading: IconButton(
icon: const Icon(Icons.edit, size: 30),
onPressed: () {
setState(() {
log("Edit $index pressed");
});
},
),
title: Text('P' + index.toString() + ':'),
subtitle: Text('-'),
trailing: Padding(
child: Transform.scale(
child: Switch(
onChanged: (v) {
setState(() {
scheduleList[index].enabled = v;
log("P$index is $v, scheduleList enabled = " +
scheduleList[index].enabled.toString());
});
},
value: scheduleList[index].enabled,
),
),
),
onTap: () {
log('Tapped #' + index.toString());
setState(() {
_selectedProgramIndex = index;
});
},
),
);
},
);
}
}
发生这种情况是因为 List.filled()
创建了一个列表,其中所有元素实际上都使用同一个对象。换句话说,您的 scheduleList 一遍又一遍地具有相同的对象,而不是不同的对象。要为每个索引创建一个新对象,请改用 List.generate()
。
只需用此替换您的 //Init list of programs
代码即可:
//Init list of programs
List<ScheduleProgram> scheduleList = List<ScheduleProgram>.generate(
10,
(index) => ScheduleProgram(
enabled: false,
isStart: false,
time: TimeOfDay(minute: 0, hour: 0),
duration: 0,
dow: [false, false, false, false, false, false, false]),
growable: false);