因为我有一个视图层次结构,其中有一个动态列表小部件(使用listview.builder,大约100+视图同时),即Listview/ singlechildscrollview的子视图。
问题在于当Listview.builder呈现其中所有小部件时,它的listview/ scroll视图的子视图是什么时候。
我只想呈现那些显示为列表视图的视图。生成器行为。(滚动时循环)
runApp(MyApp( items: List<String>.generate(100, (i) => 'Item $i'), ));
class MyApp extends StatelessWidget {
final List<String> items;
const MyApp({super.key, required this.items});
@override
Widget build(BuildContext context) {
const title = 'Long List';
return MaterialApp(
title: title,
home: Scaffold(
appBar: AppBar(
title: const Text(title),
),
body: ListView(
children: [
Text("Test nexted List rendering"),
ListView.builder(
shrinkWrap: true,
itemCount: items.length,
itemBuilder: (context, index) {
print(index);
return ListTile(
title: Text(items[index]),
);
},
),
],
)),
);
}
}
3条答案
按热度按时间7gs2gvoe1#
shrinkWrap: true
不好。您可以使用自定义滚动视图。关于ShrinkWrap vs Slivers | Decoding Flutter的更多信息
或者在一般情况下,如果希望文本总是在最上面,请通过删除
shrinkWrap: true
来使用body:Column
和Expnaded(child:ListView
。kyvafyod2#
阅读此处:https://docs.flutter.dev/cookbook/lists/long-lists
标准的ListView构造函数适用于小列表。若要处理包含大量项的列表,最好使用ListView.builder构造函数。
默认的ListView构造函数要求一次创建所有项目,与此相反,ListView.builder()构造函数在项目滚动到屏幕上时创建项目。
您的
ListView.builder
呈现了它的所有项目,因为父ListView
呈现了它内部的所有子小部件。解决方法:
将
ListView
更改为Column
预览:仅在列表视图构建器中呈现了15个项目,即使其
shrinkwrap: true
zzzyeukh3#
不要将ListView与
shrinkWrap = true
一起使用。更多关于here的信息。替代方案:
属性为
mainAxisSize: MainAxisSize.min
的列,并使用Flexible()
使其扩展可供子级使用的尽可能多的空间。