（扑）无限滚动`ListView.builder`具有有限的内容 [英] (Flutter) Infinite Scroll `ListView.builder` with Finite Content

问题描述

如何使 ListView.builder 能够滚动到空白处

How do I make my ListView.builder be able to scroll to empty space both to the top and to the bottom?

例如，我有一个自定义小部件列表，我希望用户能够获得顶部列表中的卡片（位于屏幕顶部）通过滚动到拇指更靠近拇指，而 Flutter 则用空白背景呈现顶部空间。

For example, I have a list of custom widgets, and I would like the user to be able to get the top card on the list — which is at the top of the screen — closer to his thumb by scrolling to it, while Flutter renders the top space with an empty background.

我代码的基本形状是 ListView.builder 的基本实现构造函数：

The basic shape of my code is a basic implementation of the ListView.builder constructor:

ListView.builder(
  itemCount: widgetsList.length,
  itemBuilder: (context, index){
    return widgetsList[index];
  },
),

我尝试摆弄一些 ListView.builder 的属性以及到目前为止的一些解决方法：

I've tried fiddling with some of the ListView.builder's properties and also some workarounds so far:

1. 起初，我以为 shrinkWrap：true 或 physics：AlwaysScrollableScrollPhysics（） —也许我必须设置 AlwaysScrollableScrollPhysics（）的 parent 参数？ —可以完成这项工作，但它们似乎都不起作用。


2. 我还尝试通过创建空的容器 s都位于列表的顶部和底部，并添加类似 dragStartBehavior：DragStartBehavior.values [1] 的东西-我不认为这就是使用<实际上是code> .values 属性-使列表从第二个值开始，但是没有用。

1. At first, I thought that either shrinkWrap: true or physics: AlwaysScrollableScrollPhysics() — maybe I have to set the parent parameter of AlwaysScrollableScrollPhysics()? — would do the job, but none of them seem to work.
2. I've also tried to do this artifially by creating empty Containers both on the top and the bottom of the list, and adding something like dragStartBehavior: DragStartBehavior.values[1] — I don't think that's how you use the .values property actually — to make the list start from the second value, but it didn't work.

推荐答案

可以通过 容器解决方法来实现。您可以使用 ScrollController 并使其具有 initialScrollOffset ，其中顶部的 Container 结束。这是我后来才通过其他StackOverflow问题找到的东西。

That is possible to be achived with your "Container workaround". You could use a ScrollController and have its initialScrollOffset where the top Container ends. It is something I only later found out through this other StackOverflow question.

1. 在小部件的类中声明 ScrollController 。
   
   

1. Declare your ScrollController inside your widget's class.

ScrollController scrollController = ScrollController(
  initialScrollOffset: 10, // or whatever offset you wish
  keepScrollOffset: true,
);

将控制器添加到您的 ListView

Add the controller to your ListView

ListView.builder(
  controller: scrollController,
  itemCount: widgetsList.length,
  itemBuilder: (context, index){
    return widgetsList[index];
  },
),

此外，您甚至可能想为背景滚动动作创建动画。这可以通过在窗口小部件的 initState 中使用 .animateTo 方法来实现。

Additionally, you may even want to create animations for the background scrolling action. That is possible through using the .animateTo method inside your widget's initState.

这篇关于（扑）无限滚动`ListView.builder`具有有限的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！