列表

Question

如何使用GridLayout将标题放在listview中。 当我把标题放在listview上面时，我的标题占用了一些高度，而listview中的最后一行没有显示，因为标题。

我还找到了一种直接在listview中设置标题的方法：

data-win-options="{ header: select('.header') }"> 

这个我的标题位于列表的左侧，而不是列表的上方，就像普通标题一样。 我没有看到任何关于listview GridLayout和上面标题部分的例子（例如我想把搜索框和标题放在标题中）。

这有什么例子吗？

Answer 1

这里有两个解决方案：

  

1）这是我从微软获得的答案：

     

在列表视图中加载WinJS.UI.GridLayout的视口   水平。      您需要将视口的方向更改为垂直方向。你可以做   通过附加事件onloadingstatechanged事件。

args.setPromise(WinJS.UI.processAll().then(function () {
                listview.winControl.onloadingstatechanged = function myfunction() {
                    if (listview.winControl.loadingState == "viewPortLoaded")
                    {
                        var viewport = listview.winControl.element.getElementsByClassName('win-viewport')[0];
                        viewport.className = 'win-viewport win-vertical';
                    }
                }
            }));

     

并将类win-horizo​​ntal更改为win-vertical。   

2）在没有data-win-options =“{header：select（'。header'）}”属性的情况下添加标准html标题和列表标题也可以解决问题。

在这种情况下，我们需要计算列表的高度：

 .list {
    height: calc(100% - headerHeight);
 }