ListView.separated返回对Null值使用的Null检查Error

Question

我正在尝试创建一个瓦片列表。我用过ListView.separated。但它总是出错。

════════呈现库捕获到异常═════════════════════════════════RenderBox未布局：_RenderScrollSemantics#aa680 relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE'package:flatt/src/rendering/box.dart'：包装：扑动/…/渲染/框。省道：1断言失败：行1982位置12:"hasSize">

════════呈现库捕获到异常═════════════════════════════════空值上使用的空检查运算符

这是代码

class _NewtilesState extends State<Newtiles> {
@override
Widget build(BuildContext context) {

return Container(
child: Expanded(
child: ListView(
children: [
ListView.separated(
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text('Person $index'),
subtitle: Text("Your Message"),
trailing: Text("11:10 PM"),
);
},
separatorBuilder: (BuildContext context, int index) {
return Divider();
},
itemCount: 30)
],
),
),
);
}
}

Answer 1

问题的出现是因为您将一个没有shrinkWrap的Scrollable(ListView.separated放入另一个Scrollable-ListView。在您的特定示例中，您应该跳过外部ListView，将ListView.separated直接放入Container。

当您将Expanded作为一个灵活小部件的直接子部件(因此Column或Row(，使其占用所有剩余空间时，它就起到了一定的作用。

您的Container也是多余的，因为除了child之外，您不向它传递任何参数。

如果你想在这样的列中有几个可变高度的小部件，你可能想把CustomScrollView和SliverList一起使用。

Answer 2

这应该有效：

return Container(
child: ListView.separated(
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text('Person $index'),
subtitle: const Text("Your Message"),
trailing: const Text("11:10 PM"),
);
},
separatorBuilder: (BuildContext context, int index) {
return Divider();
},
itemCount: 30),
);

Answer 3

return Container(
child: Expanded(
child: ListView.separated(
shrinkWrap: true,  // <--- add this line
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text('Person $index'),
subtitle: Text("Your Message"),
trailing: Text("11:10 PM"),
);
},
separatorBuilder: (BuildContext context, int index) {
return Divider();
},
itemCount: 30),
),
);