ListView
ListViewウィジェットは、複数の項目を1つの軸（デフォルトは縦）に並べてスクロールできるリストです。
データの件数だけ項目を繰り返して描画し、リスト・フィード・検索結果のように項目が連続する画面で使用します。
定義・役割
ListViewウィジェットは、子項目を指定した軸に沿って順番に配置し、画面に収まらない部分もスクロールで続けて見られるようにします。繰り返す項目の件数はバインドしたデータに合わせて増減し、項目の間隔・内側の余白・スクロール方向・スクロールの物理効果などを設定できます。スクロールが終端に達したときのイベントを受け取って次のデータを読み込む無限スクロールにも使えます。
- カテゴリー：Layouts
- デフォルトのスクロール方向：
vertical - デフォルトの項目数：
0
機能
| 機能 | 説明 |
|---|---|
| 項目の繰り返し描画 | バインドしたデータの件数（itemCount）だけ子項目を繰り返して描画します。 |
| スクロール方向 | 縦（vertical）または横（horizontal）に項目を並べてスクロールします。 |
| 項目の間隔 | spacingの値で項目の間に一定の間隔を空けます。 |
| スクロール終端の検知 | スクロールがリストの終端に達するとonScrollEndイベントが発火し、追加読み込み（無限スクロール）に活用できます。 |
| オーバーフローのクリップ | overflowModeをclipにすると、決められた領域に合わせて項目を切り取り、切り取られた件数を報告します。 |
| 登場アニメーション | animation設定で、項目が順番に現れる（staggered）登場効果を付けられます。 |
使い方
- 左のウィジェットパレットでLayoutsカテゴリーを開きます。
- ListView項目をキャンバスにドラッグ＆ドロップします。
- リストの中に繰り返して表示する子項目（ウィジェット）を配置します。
- 右のPropertiesパネルで
itemCountをデータにバインドするか、件数を指定します。 - 必要に応じてスクロール方向（
scrollDirection）・項目の間隔（spacing）・余白（padding）などを調整します。
プロパティ
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
scrollDirection | 項目を並べてスクロールする方向 | vertical | horizontal, vertical |
reverse | 項目の順序を反転して表示 | オフ（false） | true / false |
shrinkWrap | 内容のサイズに合わせてリストのサイズを縮める | オン（true） | true / false |
spacing | 項目の間隔 | 未設定 | 数値 |
padding | リストの内側の余白 | 未設定 | 余白 |
controller | スクロールを制御するコントローラー | 未設定 | スクロールコントローラー |
primary | 画面のプライマリスクロールビューとして使うかどうか | 未設定 | true / false |
physics | スクロールの物理効果 | 未設定 | bouncing, clamping, alwaysScrollable, rangeMaintaining, neverScrollable, page |
itemExtent | 各項目の固定サイズ（主軸方向） | 未設定 | 数値 |
addAutomaticKeepAlives | 画面外の項目の状態を自動的に保持 | オン（true） | true / false |
addRepaintBoundaries | 項目ごとに再描画境界を追加 | オン（true） | true / false |
addSemanticIndexes | 項目にアクセシビリティインデックスを自動付与 | オン（true） | true / false |
cacheExtent | 画面外に先に構築しておく領域のサイズ | 未設定 | 数値 |
semanticChildCount | アクセシビリティに通知する項目数 | 未設定 | 整数 |
itemCount | 繰り返して描画する項目数（データバインディング対応） | 0 | 整数 |
dragStartBehavior | ドラッグスクロールが開始される基準 | start | start, down |
keyboardDismissBehavior | スクロール時にキーボードを閉じる方法 | manual | manual, onDrag |
restorationId | スクロール位置の復元に使う識別子 | 未設定 | 文字列 |
clipBehavior | 領域を超える内容のクリップ方法 | hardEdge | none, hardEdge, antiAlias, antiAliasWithSaveLayer |
animation | 項目の登場（staggered）アニメーション設定 | 未設定 | アニメーション設定 |
overflowMode | 領域を超える項目の処理方法 | none | none, clip |
reservedTrailingExtent | clipモードで利用可能な幅からさらに空けておく幅 | 未設定 | 数値 |
注意・ヒント
ヒント
onScrollEndはスクロールがリストの終端に達したときに一度発火し、終端から離れると再び発火できる状態に戻ります。次のページを読み込む無限スクロールに活用してください。
警告
scrollToIndexとgetFirstVisibleIndexは、itemExtent（項目の固定サイズ）が設定されていないと動作しません。値がない場合、インデックスへのスクロール移動は何も起こらず、最初の項目のインデックスは0を返します。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control（Property・Method・Event）の全体は、ListView Widget Controlドキュメントで確認してください。