我正在Flutter中创建一个表单(不使用Form
小部件),用户可以在其中添加任意数量的项目(治疗),这些项目在Wrap
小部件中呈现为InputChip
小部件列表。
表格使用按钮(AddButton
小部件)打开表格对话框,该对话框本身返回添加到 selectedItems 的新创建项目(治疗):
class TreatmentsWidget extends StatefulWidget {
const TreatmentsWidget({super.key, required this.selectedItems});
final List<Treatment> selectedItems;
@override
State<TreatmentsWidget> createState() => _TreatmentsWidgetState();
}
class _TreatmentsWidgetState extends State<TreatmentsWidget> {
@override
Widget build(BuildContext context) {
var chips = widget.selectedItems.map(
(item) {
return InputChip(
label: Text('${item.name} - ${item.frequency}/${item.frequencyUnit.name})',
);
},
).toList();
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Wrap(
children: chips,
),
AddButton(onPressed: () {
showDialog(
context: context,
builder: (BuildContext context) {
return const TreatmentDialog();
}).then((value) {
if (value != null) {
Treatment item = value;
setState(() {
widget.selectedItems.add(item);
});
}
});
}),
],
);
}
}
出于某种原因,当向 selectedItem 添加新项并且该项溢出当前行时,不会重新计算布局,从而Wrap
小部件溢出按钮:
但是,只要用户滚动(整个屏幕内容都在SingleChildScrollView
内),布局就会重新计算,Wrap
会占用正确的空间量:
当添加新项目时,如何强制重绘以防止此问题?
1条答案
按热度按时间bbuxkriu1#
问题似乎是,当
Column
的一个子帧大小发生变化时,Column
不会在当前帧上重新计算其大小。最后,每当
chips.length
发生更改时,我都使用ValueKey
强制重新构建Column
:我仍然对一个更干净的解决方案感兴趣,如果它存在的话。使用提供程序对于这种情况似乎大材小用。