WinJS Liste GridLayout Header über Liste

Question

Wie Header in ListView mit GridLayout setzen. Wenn ich Kopfzeile über Listview setze, nehme meine Kopfzeile eine gewisse Höhe und die letzte Zeile in der Listenansicht wird nicht angezeigt, wegen Kopfzeile.

Ich fand auch einen Weg Header in Listenansicht setzen direkt:

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

Damit meine Header auf der linken Seite der Liste positioniert ist, nicht über der Liste, wie normaler Kopf sein sollte. Ich habe kein Beispiel mit listview GridLayout und Header-Abschnitt oben gesehen (zum Beispiel möchte ich Suchfeld und Überschrift im Header setzen).

Ein Beispiel dafür?

Answer 1

Zwei Lösungen sind hier:

1) Diese Antwort ist ich von Microsoft erhalten:

In der Liste der von WinJS.UI.GridLayout Ansicht Ansichtsfenster horizontal geladen wird. Sie müssen die Ausrichtung des Ansichtsfensters auf vertikal einstellen. Sie können dies tun, indem Sie das Ereignis onloadingstatechanged Ereignis anhängen.

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'; 
        } 
       } 
      })); 

und ändern Sie die Klasse win-horizontal zu win-vertikal.

2) Problem auch Standard-HTML-Header und Liste unten Header ausgewertete Zugabe werden kann, ohne Daten-win-options = "{header: 'header' select()}" Attributs.

In diesem Fall wir Höhe der Liste berechnen müssen:

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