Question

一旦用户滚动到列表视图的末尾，我就需要加载更多项目。

我尝试使用微软样本：http://code.msdn.microsoft.com/windowsapps/ListView-loading-behaviors-718a4673/view/SourceCode（方案2），但是在 windows phone 8.1 中，列表视图的接缝行为不一样。

当我运行样本时，我可以看到只加载了可查看的内容（例如5个5的50）。但对于Windows手机，它确实加载所有项目。

我使用此代码：

listView.winControl.itemTemplate = this.incrementalTemplate;
incrementalTemplate: function (itemPromise, recycledElement) {
    if (!recycledElement) {
        recycledElement = document.createElement('div');
    }
    var renderComplete = itemPromise.then(function (item) {

        console.log(item.index);


        itemTemplate.winControl.render(item.data, recycledElement);
        return item.ready;
    }).done(function (item) {
        console.log("clp"+item.index);

    });
    return { element: recycledElement, renderComplete: renderComplete };
},

项目是异步加载的。我可以在我的控制台中看到它打印50倍的索引和50倍的clp +索引。即使我的列表一次只显示5个项目。

此外，我的listview似乎从未触发加载状态事件

listView.addEventListener("loadingstatechanged", function (args) {
    //never fired
}, false);

Answer 1

列表视图位于集线器中，解决方案是在win pivot项目上添加onscroll事件：

 document.querySelector(".win-pivot-item-content").onscroll = function () {
                if (self.scrollAtBottom(this) === true) {
                    //load more
                }
            };

   scrollAtBottom : function(element){
        return element.scrollHeight - element.scrollTop === element.clientHeight
    },

Answer 2

如果您想在滚动ListView时订阅活动，可以ListView's Scrollviewer并订阅ViewChanged活动。唯一的问题是我不知道它在winjs中的样子，在C#它看起来像是这样：

// method to pull out a ScrollViewer
public static ScrollViewer GetScrollViewer(DependencyObject depObj)
{
    if (depObj is ScrollViewer) return depObj as ScrollViewer;

    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(depObj); i++)
    {
        var child = VisualTreeHelper.GetChild(depObj, i);

        var result = GetScrollViewer(child);
        if (result != null) return result;
    }
    return null;
}

// subscription:
GetScrollViewer(yourListView).ViewChanged += yourEvent_ViewChanged;

也许会有所帮助。

Answer 3

评论在这里投票，因为解决方案不能像开箱即用那样工作，但是从这开始我找到了解决这个问题的方法。请参阅我在https://github.com/winjs/winjs/issues/690#issuecomment-61637832打开的问题的第一个答案（包括代码段）

使用winjs检测listview上的滚动事件

3 个答案: