我正在使用 Sencha Touch 构建一个类似电子邮件的应用程序,并且我使用 NestedList 小部件作为导航面板。
- 收件箱
- 邮件1
- 邮件2
- 邮件3
- 发件箱
收件箱中可能有很多邮件,所以我想按需加载它,当用户滚动到列表末尾时,它会自动加载接下来的 10 个项目并将新项目附加到列表中。
我怎样才能做到这一点?
我正在使用 Sencha Touch 构建一个类似电子邮件的应用程序,并且我使用 NestedList 小部件作为导航面板。
收件箱中可能有很多邮件,所以我想按需加载它,当用户滚动到列表末尾时,它会自动加载接下来的 10 个项目并将新项目附加到列表中。
我怎样才能做到这一点?
您可以尝试以下方法:
var loadingItems = false;
var fetchItems = function () {
//fetch new items to add
loadingItems = false;
};
//nestedList: reference to the nestedList
//x: new x position
//y: new y position
var scrollListener = function(nestedList, x, y) {
//set some boundary for where we should start loading data
var screenBottom = nestedList.getHeight() - OFFSET;
//if we're within some region near the bottom of the list...
if((y >= screenBottom) && !loadingItems) {
loadingItems = true;
fetchItems();
}
};
nestedList.addListener("move", scrollListener);
由于 Sencha Touch 与 ExtJS 共享大量代码,您可能会通过查看 ExtJS 中的各种 liveGrid 实现来了解如何实现这一点,因为这基本上是您正在创建的。
这是我用过的最稳定、最全面的 livegrid: http ://www.ext-livegrid.com/