【问题标题】:Set the scroll position in WinJS.UI.ListView在 WinJS.UI.ListView 中设置滚动位置
【发布时间】:2013-03-18 15:32:33
【问题描述】:

我想在特定项目上自动滚动我的 ListView。 ListView 必须自动滚动到其索引中的项目。

listView.ensureVisible(itemIndex); 

但它不起作用。另一种选择:

yourListView.currentItem = { index: 8, hasFocus: true, showFocus: true }

它也失败了。

如何解决?

【问题讨论】:

    标签: javascript listview microsoft-metro windows-store-apps winjs


    【解决方案1】:

    通常,您必须将对 ensureVisible(index) 的调用封装在对 msSetImmediate 的调用中。不知道为什么会这样,可能是一个错误,但对我有用。示例:

    msSetImmediate(function (){ listView.ensureVisible(4);} );
    

    如果您查看setImmediate 的文档(msSetImmediate 是 Microsoft 特定的实现),该功能被描述为:

    请求在当前或未决任务完成时调用函数,例如事件或屏幕更新。

    这确实有点道理,因为它听起来像是确保在调用之前完成所有列表视图动画等以确保项目可见。

    相关帖子请参见此主题:http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/2f11e46f-9421-4e31-93d3-fca06563ec41/

    【讨论】:

    • 是的,我知道,现在我将这部分代码放在就绪函数中,它应该可以与我的 ListView 一起正常工作,但事实并非如此,它不会产生任何异常,但我没有看到任何异常滚动改变我的滚动条的位置。我想知道是否有一些特定的 html 属性。所以这是我的 ListView:
    • @Brahim 那时我们可能需要看到更多的代码。我在几个项目中使用了 ensureVisible,它可以像上面一样正常工作,因此它必须特定于您的设置中的某些内容。
    • ensureVisible 只要应用程序不处于快照状态,就可以为我工作。一旦它被捕捉,ensureVisible 不再起作用。仍在寻找解决方案。
    • @Beanwah 您是否尝试过将操作延迟一点?尝试像setTimeout(function () { listView.ensureVisible(4); }, 3000); 这样荒谬的事情,然后从那里降低超时。
    【解决方案2】:

    我可能会给你一个答案。您不能立即设置 ListView 的滚动位置,因为 ListView 的布局尚未完成,因此尝试将其滚动到某个位置是徒劳的。因此,您必须等到 ListView 达到计算其布局的状态。方法如下...

    myListView.onloadingstatechanged = function () {
        if (app.sessionState.homeScrollPosition && myListView.loadingState == "viewPortLoaded") {
            myListView.scrollPosition = app.sessionState.homeScrollPosition;
            app.sessionState.homeScrollPosition = null;
        }
    };
    

    您可以通过查看我的开源 codeSHOW project 中的 /pages/home/home.js 文件在上下文中看到这一点。 希望对您有所帮助。

    【讨论】:

    • yeh 想了很多,你能指定代码的哪一部分或哪一行?你用来在索引的正确位置自动滚动你的listView。
    • /pages/home/home.js 中的第 61 行是我设置滚动位置的位置(自动滚动到某个位置)。在同一文件的第 25 行,您可以看到我在哪里设置滚动位置。当用户离开该页面时,它会将滚动位置保存在 sessionState 属性中。
    猜你喜欢
    • 2010-09-29
    • 1970-01-01
    • 2011-04-03
    • 2012-10-24
    • 2011-09-20
    • 1970-01-01
    • 2015-10-08
    • 2011-06-10
    • 2013-10-16
    相关资源
    最近更新 更多