如何实现无尽列表视图的项目延迟加载?当用户滚动到列表视图的末尾时,我想通过网络加载更多项目。
你可以听一个ScrollController。
ScrollController
ScrollController包含一些有用的信息,例如scrolloffset和的列表ScrollPosition。
ScrollPosition
在您的情况下,有趣的部分是controller.position当前可见的部分ScrollPosition。它代表了可滚动的一段。
controller.position
ScrollPosition包含有关其在滚动条中位置的信息。如extentBefore和extentAfter。或者它的大小,用extentInside。
extentBefore
extentAfter
extentInside
考虑到这一点,您可以根据extentAfter表示可用的剩余滚动空间来触发服务器调用。
这是使用我所说的基本示例。
class MyHome extends StatefulWidget { @override _MyHomeState createState() => new _MyHomeState(); } class _MyHomeState extends State<MyHome> { ScrollController controller; List<String> items = new List.generate(100, (index) => 'Hello $index'); @override void initState() { super.initState(); controller = new ScrollController()..addListener(_scrollListener); } @override void dispose() { controller.removeListener(_scrollListener); super.dispose(); } @override Widget build(BuildContext context) { return new Scaffold( body: new Scrollbar( child: new ListView.builder( controller: controller, itemBuilder: (context, index) { return new Text(items[index]); }, itemCount: items.length, ), ), ); } void _scrollListener() { print(controller.position.extentAfter); if (controller.position.extentAfter < 500) { setState(() { items.addAll(new List.generate(42, (index) => 'Inserted $index')); }); } } }
您可以清楚地看到,当到达滚动的末尾时,滚动条会由于加载了更多项目而消耗。