如何创建滚动指示器

Posted 2023-02-23

【中文标题】如何创建滚动指示器

【英文标题】：How to create a scroll indicator

【发布时间】：2018-09-15 11:23:00

【问题描述】：

我试图在CustomScrollView 的底部显示一个阴影/滚动指示器，以指示用户可以向下滚动。只有当您实际上可以向下滚动时，滚动指示器才应该可见。

在我第一次尝试创建它时，我分配了一个ScrollController 到CustomScrollView，这样我就可以获得最大的滚动范围和 当前滚动位置。不幸的是，这没有用，因为 ScrollController 仅附加到 CustomScrollView 在第一次构建期间，所以我不能在第一次构建期间使用它来获取 我需要的信息。

对于我的第二次尝试，我仔细研究了实现自定义 Sliver，但没有任何运气。我试着从 SliverAppBar 代码（如建议的here）但发现它 很难理解，而且信息不多 关于Slivers 还没出来。

我的问题：我该如何实现（如果可能，不使用自定义条子）？如果需要 slivers，我很想获得一些额外的信息，也许还有一些指向涵盖该主题的资源的链接。

【问题讨论】：

也许你也想看看Scrollbar。

@RémiRousselet 据我了解，它使用NotificationListener 和ScrollNotification 泛型来获取滚动事件。所以我相信它实际上并没有提供任何关于是否有向下滚动空间的信息，它只是在用户实际滚动时通知更改。此外，这个监听器也将在第一次构建时附加，所以我相信我会遇到与第一次尝试相同的问题：/

@RémiRousselet 这也可能是使用ScrollNotification 的问题： - 当 NotificationListener 收到滚动通知时，侦听器已经完成构建和布局，因此为时已晚让该小部件调用 State.setState。 (docs.flutter.io/flutter/widgets/ScrollNotification-class.html)

是的。比 Slivers 是唯一的解决方案。

【参考方案1】：

如果需要检测用户何时向下滚动到ListView底部，可以设置一个ScrollController监听器，如果滚动位置在边缘。

_scrollController.addListener(() 
  if (_scrollController.position.atEdge) 
    if (_scrollController.position.pixels == 0) 
      debugPrint('Scroll position at top');
     else 
      debugPrint('Scroll position at bottom');
      // Load more list items
    
  
);

记住，需要在 ListView 上配置 ScrollController。

ListView.builder(
  controller: _scrollController,
  ...
)