NativeScript RadListView：无限滚动到顶部？

Posted 2023-04-13

【中文标题】NativeScript RadListView：无限滚动到顶部？

【英文标题】：NativeScript RadListView: Infinite scroll to top?

【发布时间】：2018-01-14 17:43:58

【问题描述】：

我正在使用最新的 nativescript (3.1.1) 和 RadListView。当用户向上滚动列表时，我试图实现无限滚动（类似于 Facebook Messenger、Whatsapp 和其他聊天应用程序的工作方式）。

我知道loadOnDemand 效果很好，但它仅在用户向下滚动时才有效。当用户向上滚动时，有没有办法让loadOnDemand 工作？或者任何其他解决方法？

非常感谢！

【问题讨论】：

您指出的应用程序都没有无限向上滚动，例如“Whatsapp”只是从聊天的底部开始，如果聊天时间很长，它可能看起来/感觉它是无限的，但是如果你滚动得足够多，你最终会出现在“listview”的顶部。我不知道有任何应用程序在向上滚动时具有“按需加载”，对于该方向，所有应用程序都“拉动刷新”，这在 RadListView 组件中受支持。

@VladimirAmiorkov 在whatsapp 中，向上滚动时看右边的滚动条，向上滚动时会看到它变小——这就是我所说的无限向上滚动

在 android 的 RadListView 中 N 显示垂直/水平滚动条是不可能的，因为 Android 框架 + NativeScript 在显示这些滚动条方面的限制。在 Android 中，显示这些滚动条只能通过 XML 完成，在 NativeScript 框架中是不可访问的，所有“本机”操作都需要通过代码完成。由于仅使用 XML 的限制，我们无法提供任何显示/隐藏滚动条的自定义。

我不想显示滚动条，这只是一个示例。我所需要的只是与任何聊天客户端相同的要求 - 最新消息显示在底部，如果您向上滚动，一旦您点击顶部（或接近顶部），就会获得旧消息的下一页。跨度>

【参考方案1】：

当前版本的 RadListView 没有提供这种“向上按需加载”的功能，但提供了“拉动刷新”和“从底部按需加载”。

您可以通过使用RadListView 的滚动事件 的一些自定义实现来实现这一点，如discourse.nativescript.org 线程here 中所述。我也会在这里发布答案的文本，以便更好地向社区展示：

实际上，我认为您可以使用滚动轻松实现此目的 RadListView 暴露的事件： http://docs.telerik.com/devtools/nativescript-ui/Controls/NativeScript/ListView/scrolling

您可以特别使用滚动： http://docs.telerik.com/devtools/nativescript-ui/api/classes/radlistview.html#scrolledevent

此事件公开列表的当前滚动偏移量。一旦它 变为 0 或负数，您可以开始数据获取过程，引发标志 一个进程正在执行，一旦数据到达就重置它。

【讨论】：

我知道这个线程很旧，但我正在尝试实现类似的功能，并且已经尝试过不和谐引用中描述的内容并且它正在工作，但问题是我正在使用 unshift 添加项到数组的开头，当添加新项时列表移动到顶部。我希望它保持在原来的位置，这样用户就可以向上滚动而不是迷失在跳跃列表中。知道如何保持列表位置吗？我尝试了 scrollToIndex 但它会滚动，因此该项目位于列表底部的视口中 - 我需要它位于最初之前的相同位置。