3

そのため、さまざまに拡大および縮小するグループ化されたListViewを必要とするビジュアルページを作成しています。グループは、追加または削除できます。これが私がそれをどのように見せたいかです（参考のために）

さまざまなリストビューアイテム（ミックス）が適切にグループ化されており、一部はページからはみ出します。これは、Windowsストアアプリで非常に一般的なデザインパターンです。

heightさて、ここに私の問題があります：とwidthプロパティが決定的なピクセル数に設定されている場合にのみ、ListViewを正しく表示させることができます。例：

#myListView {
height: 700px;
width: 2000px; }

およびを100％またはからの値のようなものに設定するheightと、必然的にListViewにデータが入力されず、レンダリングされません。クイックスタートによると：MSDNのListViewページの追加：widthcalc()

ListViewをレンダリングするには、その高さの絶対値を指定する必要があります。

このアプリはさまざまな画面に表示され、高さが可変である必要があることを除けば、これはすべて問題ありません。ListViewは水平方向にスクロールするため、これは特に重要です。ストアアプリの場合と同じように、ページの一番下にスクロールバーを表示したいと思います。

heightプログラムでリセットしようとしましたが、うまくいきませんでした。では、このListViewをさまざまな画面で正しくレンダリングするにはどうすればよいですか？以下は参考のために私のHTMLコードです。

<div id="allMixesListView" data-win-control="WinJS.UI.ListView" 
data-win-options="
 {
  itemTemplate: select('#myTemplate'),
  groupHeaderTemplate: select('#myHeaderTemplate'), 
  layout: {type: WinJS.UI.GridLayout}, 
  selectionmode: 'none', 
  itemDataSource: dummyData.placeholderData.dataSource
 }" 
class="myListView"> 
</div>
4

2 に答える 2

3

WinJS.UI.ListViewを設定することは完全に可能height: 100%です。ただし、参加しているレイアウトには、「定義された」高さも必要です。明示的である必要はありませんが（たとえば、そうではありません）700px、明確なスペースを作成する必要があります。

例; このHTMLが与えられた場合：

<body>
    <div>
        <div data-win-control="WinJS.UI.ListView" style="height: 100%"></div>
    </div>
</body>

リストビューが表示されているDIVの高さは、ページの100％ではありません。親の100％です。高さはありません。そのため、必要なだけ小さく設定されます。おっと。

高さを100％からに変更するheight: 100vhと、このレイアウトが機能します。これは、リストビューの高さが、親divがスペースを占めるポイントまで計算されており、リストビューにはレイアウトするスペースがあるためです。

答えは厳密には「100vhに設定」ではないことに注意してください。それは「レイアウトにアイテムをレイアウトするのに十分なスペースがあることを確認する」です。親要素で-ms-gridを使用した場合は、それも設定されています（行、列が正しく設定されていると仮定します）

于 2013-01-18T16:52:04.670 に答える
-2

Windows8アプリの高さを変更しないでください。Microsoftは、ユーザーが垂直方向ではなく水平方向にスクロールするように設計しました。そのため、LiveViewには明確な高さが必要です。私はそれが決定的な幅を必要とするとは思わない。

于 2013-01-18T15:43:07.560 に答える