android - Flutter listview:移除一个Item时,下一个继承一些属性
问题描述
我正在开发一个项目,其中有一个名为 AlarmCard 的自定义小部件的 ListView,每个小部件都填充了警报对象的信息。AlarmCard 有两个布尔属性:Expanded 和 Loading,这是主要代码:
class _AlarmCardState extends State<AlarmCard>{
bool _expanded = false;
bool _loading = false;
static const double iconSize = 28.0;
static const Color iconColor = Colors.black87;
static const TextStyle fieldTextStyle = TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.w400,
color: Color.fromRGBO(0, 0, 0, 0.6),
);
static const TextStyle clearFieldTextStyle = TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.w400,
color: Color.fromRGBO(0, 0, 0, 0.2),
);
@override
Widget build(BuildContext context) {
TextStyle timeTextStyle = TextStyle(
fontSize: 54.0,
fontWeight: FontWeight.w400,
color: Colors.black54,
);
Widget card = Card(
child: Column(
children: <Widget>[
Opacity(
opacity: _loading ? 1.0 : 0.0,
child: Container(
height: 3.0,
child: ClipRRect(
child: LinearProgressIndicator(),
borderRadius: BorderRadius.only(
topRight: Radius.circular(3.0),
topLeft: Radius.circular(3.0),
),
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(12.0, 8.0, 12.0, 8.0),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(top: 6.0, bottom: 8.0),
child: InkWell(
onTap: () => _selectTime(context),
child: Text(widget.alarm.timeString, style: timeTextStyle)
),
),
Switch(value: widget.alarm.enabled, onChanged: _onAlarmEnabledChange),
],
),
AnimatedCrossFade(
firstChild: _getContractedBottom(),
secondChild: _getExpandedBottom(),
duration: Duration(milliseconds: 200),
crossFadeState: _expanded ? CrossFadeState.showSecond : CrossFadeState.showFirst,
)
],
),
),
],
),
);
return _loading ?
Opacity(
opacity: 0.6,
child: IgnorePointer(
child: card
),
)
: card;
}
...
}
当然,还有一些自定义小部件,例如 DayToggle,以及返回小部件的 _getContractedBottom() 和 _getExpandedBottom() 方法。一旦我们定义了依赖 _expanded 和 _loading 的 AlarmCard 构建方法,我们使用final List<Alarm> alarmList
如下方式构建 ListView:
ListView.builder(
itemCount: alarmList.length,
itemBuilder: (BuildContext context, int i) {
Alarm alarm = alarmList[i];
return AlarmCard(
alarm: alarm,
ringtones: ringtoneList,
onAlarmUpdated: () => true,
onAlarmDeleted: () {
setState(() {
alarmList.remove(alarm);
});
return true;
}
);
},
)
因此,ListView 完美地工作,并且每个项目都按原样显示,它可以扩展和更新(以便 _loading 变为真)。删除项目时会出现问题。
想象一下,alarmList 有 8 个项目,它们都显示在屏幕上,我们只展开和删除第 6 个项目。当我们按下Delete的那一刻,AlarmCard变成Loading状态,然后被删除,但是一旦从ListView中移除,第7项“继承”了_expanded和_loading属性,所以它显示了与它的alarm对应的正确信息,但它被扩展和加载,而它不应该。
有人知道问题可能出在哪里吗?我一直在搜索多个网站和 stackoverflow 帖子,但找不到这个问题。非常感谢!
解决方案
正如@javired98 所说,问题很关键。那个视频对我有帮助。但请记住,如果您有小部件列表,则当您将其添加到未在小部件类中定义的列表时,密钥必须传递给小部件。
imageList.add(ImageElement(
key:ValueKey(imageCounter),
id: ...,
imgURL: ...,
.
.
.
));
推荐阅读
- java - 在 fatJar 中打包 node.js 文件
- javascript - 设置表单控制错误 - 错误名称是一个变量
- java - 在休眠的上下文中将@NotNull 属性添加到现有域模型的便捷模式更新策略是什么?
- python - 使用 Joblib 并获取“无法解压不可迭代的函数对象”
- google-sheets - 您如何在 Google 表格中找到一列中的一个单元格与同一列中最后一个非空单元格之间的区别?
- php - PHP下载会随机报网络错误
- pandas - Pandas,根据条件将一个 DF 的一部分与另一个相乘
- php - 用户测试中多个客户端的 Symfony 4.4 弃用警告已弃用,但仍存在于文档中
- angular - Angular FormGroup无法读取未定义的属性'get'
- asp.net-core - 从 .Net Core 3 引用 .NET Framework DLL