List
Listウィジェットを使用して、Expressionのリストなどの簡易リストを表示したり、List Itemウィジェットを追加することでより複雑なアイテムを表示したりできます。Listにはアイテムを読み込むためのソースが必要です。
仮想化
Listウィジェットは仮想化を使用して、画面に表示される要素のみを描画します。Listのアトリビュートのvirtualization-threshold-beforeおよびvirtualization-threshold-afterで、仮想化されるピクセルの値を設定できます。これらを使用して、仮想化が有効なときのListのスクロールエクスペリエンスを微調整できます。
また、disable-virtualization=Trueで仮想化を無効にすることもできます。
スクロールしきい値
Listがスクロールしきい値に達すると、アプリは新しいレコードをリクエストし、レコードをアイテムのリストに追加します。デフォルト値は2000ピクセルです。スクロールしきい値は、リストのアトリビュートのinfinite-scroll-thresholdで設定します。
プロパティ
| 名前 | 説明 | 必須 | デフォルト値 | 備考 |
|---|---|---|---|---|
| Name | 画面、アクション、モジュールといった、定義されているスコープ内の要素を識別します。 | Yes | ||
| Source | ウィジェットに読み込むレコードのリストを指定します。 | Yes | ||
| Animate Items | ［Yes］に設定すると、アイテムを追加、挿入または削除した際のアニメーション効果を設定できます。 | Yes | ||
| Mode | ［Custom］に設定すると、実行時にウィジェットが使用するカスタムHTMLタグを定義できます。Defaultモードでは、タグは［div］に設定されます。 | Yes | Default | |
| Tag | 実行時にこのウィジェットが使用するラッパーHTMLタグ。 | Yes | div | モードが［Custom］に設定されている場合にのみ使用可能です。 |
| Style Classes | ウィジェットに適用する1つまたは複数のスタイルクラスを指定します。複数の値はスペースで区切ります。 | "list list-group" | ||
| アトリビュート | ||||
| Property | この要素のHTML変換に追加するアトリビュート名。 | ドロップダウンリストからプロパティを選択するか、フリーテキストを入力します。プロパティ名はプラットフォームによって検証されません。
プロパティの重複は許可されていません。スペース、「"」、「'」も許可されていません。 |
||
| Value | アトリビュートの値。 | 値を直接入力するか、を使用してExpressionを記述します。 Valueが空の場合、対応するHTMLタグはproperty="property"として作成されます。たとえば、nowrapプロパティは値を必要としないため、nowrap="nowrap"が追加されます。 |
||
イベント
| 名前 | 説明 | 必須 | 備考 |
|---|---|---|---|
| On Scroll Ending | ユーザースクロールが読み込まれたリストの終わりに近づいたときに実行される画面アクションまたは移動先の画面。 | ||
| Transition | 他の画面に移動するときに適用される移行エフェクト。 | デフォルトでは、モジュールレベルで定義されます。 | |
| Event | 処理されるJavaScriptまたはカスタムイベント。 | ||
| Handler | JavaScriptイベントハンドラ。 |
ランタイムプロパティ
| 名前 | 説明 | 読み取り専用 | 型 | 備考 |
|---|---|---|---|---|
| Id | 実行時にウィジェットインスタンスを識別します（HTMLのid属性）。JavaScriptと拡張プロパティで使用できます。 | Yes | Text |