ListView QML Type

モデルが提供する項目のリスト表示を行います。詳細...

• 継承されたメンバーを含む、すべてのメンバーの一覧

プロパティ

• count : int (since Qt Quick Ultralite 2.9)
• currentIndex : int (since Qt Quick Ultralite 2.9)
• delegate : Component
• highlight : Component (since Qt Quick Ultralite 2.9)
• model : model
• orientation : Qt::Orientation
• spacing : real

方法

• int indexAt(real x, real y) (since Qt Quick Ultralite 2.9)
• var itemAtIndex(int index) (since Qt Quick Ultralite 1.6)
• void positionViewAtIndex(int index, PositionMode mode) (since Qt Quick Ultralite 2.9)

詳細な説明

ListViewは、ListModel などの組み込みQML型から作成されたモデルからのデータを表示します。

ListViewには、表示するデータを定義するモデルと、データの表示方法を定義するデリゲートがあります。ListView内の項目は、水平方向または垂直方向に配置されます。ListViewはFlickable を継承しているため、本質的にフリック操作が可能です。

使用例

次の例は、ListViewで使用される単純なリストモデルの定義を示しています。ここでは、ListViewがそのデリゲート用にTextアイテムを作成します。

Item {
    ListView {
        width: 180; height: 300

        model: ListModel {
            ListElement {
                name: "Bill Smith"
                number: "555 3264"
            }
            ListElement {
                name: "John Brown"
                number: "555 8426"
            }
            ListElement {
                name: "Sam Wise"
                number: "555 0473"
            }
        }

        delegate: Text {
        width: 180
        height: 30
            text: model.name + ": " + model.number
        }
    }
}

ビューは、モデル内の各項目に対して新しい Text コンポーネントを作成します。デリゲートがモデルの名前や数値データに直接アクセスできる点に注目してください。

改良例

以下に、改良されたリストビューを示します。デリゲートは視覚的に改善され、独立した contactDelegate コンポーネント内に移動されています。

Item {
    Rectangle {
        width: 360; height: 200

        Component {
            id: contactDelegate
            Item {
                width: 360; height: 60
                Column {
                    Text { text: 'Name: ' + model.name }
                    Text { text: 'Number: ' + model.number }
                }
            }
        }

        ListView {
            anchors.fill: parent

            model: ListModel {
                ListElement {
                    name: "Bill Smith"
                    number: "555 3264"
                }
                ListElement {
                    name: "John Brown"
                    number: "555 8426"
                }
                ListElement {
                    name: "Sam Wise"
                    number: "555 0473"
                }
            }

            delegate: contactDelegate
        }
    }
}

デリゲートは必要に応じてインスタンス化され、いつでも破棄される可能性があります。デリゲートはビュー自体ではなく、ListViewのcontentItemの子として配置されます。デリゲート内に状態を保存してはなりません。

レイアウトの例

ListView 内の項目のレイアウトは、orientation プロパティを使用して制御できます。このプロパティは、項目が水平方向か垂直方向に配置されるかを制御します。この値は Qt.Horizontal または Qt.Vertical のいずれかになります。

Item {
    Rectangle {
        width: 360; height: 200

        Component {
            id: contactDelegate
            Item {
                width: 120; height: 200
                Column {
                    Text { text: model.name }
                    Text { text: model.surname }
                    Text { text: "Age: " + model.age }
                }
            }
        }

        ListView {
            anchors.fill: parent
            orientation: Qt.Horizontal

            model: ListModel {
                ListElement {
                    name: "Bill"
                    surname: "Smith"
                    age: "30"
                }
                ListElement {
                    name: "John"
                    surname: "Brown"
                    age: "56"
                }
                ListElement {
                    name: "Sam"
                    surname: "Wise"
                    age: "42"
                }
            }

            delegate: contactDelegate
        }
    }
}

「ListView QML タイプ」および「モデル・ビュー・デリゲート（MVD）パターン」も参照してください 。

プロパティのドキュメント

count : int [since Qt Quick Ultralite 2.9]

このプロパティは、モデル内のアイテム数を保持します。

このプロパティは、Qt Quick Ultralite 2.9で導入されました。

currentIndex : int [since Qt Quick Ultralite 2.9]

currentIndex プロパティには、現在の項目のインデックスが格納されます。これを -1 に設定すると、ハイライトが解除されます。

このプロパティは、Qt Quick Ultralite 2.9 で導入されました。

delegate : Component

デリゲートは、リストビューによってインスタンス化される各項目を定義するテンプレートを提供します。

highlight : Component [since Qt Quick Ultralite 2.9]

このプロパティには、ハイライトとして使用するコンポーネントが格納されます。

各ListView には、ハイライトコンポーネントのインスタンスが渡され、ListView によって管理され、現在の項目をハイライト表示します。

このプロパティは、Qt Quick Ultralite 2.9で導入されました。

model : model

このプロパティには、リストにデータを供給するモデルが格納されています。

モデルは、ビュー内のアイテムを作成するために使用されるデータセットを提供します。

Qt Quick Ultraliteの「モデルとビュー」も参照してください 。

orientation : Qt::Orientation

このプロパティは、リストの向きを保持します。

spacing : real

このプロパティは、項目間の間隔を指定します。

デフォルト値は 0 です。

メソッドのドキュメント

[since Qt Quick Ultralite 2.9] int indexAt(real x, real y)

コンテンツ座標でx 、y の位置を含む、表示中の項目のインデックスを返します。指定された位置に項目が存在しない場合、またはその項目が表示されていない場合、この関数は-1 を返します。

また、アイテムがListView 内に存在するかどうかにかかわらず、アイテムが表示領域外にある場合、この関数は-1 を返します。

このメソッドは、Qt Quick Ultralite 2.9 で導入されました。

[since Qt Quick Ultralite 1.6] var itemAtIndex(int index)

index にあるアイテムを返します。そのインデックスに対応するアイテムが存在しない場合（例えば、まだ作成されていない場合や、画面外へスクロールされてキャッシュから削除された場合など）、null アイテムが返されます。

このメソッドは、Qt Quick Ultralite 1.6 で導入されました。

[since Qt Quick Ultralite 2.9] void positionViewAtIndex(int index, PositionMode mode)

ListView 内のビューポートを制御できます。index を、以下のいずれかのmode に基づいて設定します：

index でビューを配置した際に、ビューの先頭または末尾に空白が生じる場合、ビューは境界に配置されます。

このメソッドは、Qt Quick Ultralite 2.9 で導入されました。

特定の Qt ライセンスの下で利用可能です。
詳細はこちらをご覧ください。