C

PathView QML Type

モデル内のアイテムをパス上に配置します。詳細...

Import Statement:	`import QtQuick`
Since:	Qt Quick Ultralite 2.12
Inherits:	Item

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

プロパティ

count : int
currentIndex : int
delegate : Component
model : model
path : Path
pathItemCount : int
preferredHighlightBegin : real
preferredHighlightEnd : real

方法

void decrementCurrentIndex()
void incrementCurrentIndex()

詳細な説明

PathViewは、ListModel などの組み込みQML型、またはQul::ListModel を継承するC++で定義されたカスタムモデルクラスから作成されたモデルのデータを表示します。

このビューには、表示するデータを定義するmodel プロパティと、データの表示方法を定義するdelegate プロパティがあります。delegate は、PathView内の各アイテムごとにインスタンス化されます。

注：一般的なQtXMLとは異なり、Qt Quick Ultraliteでは、フリックやスワイプジェスチャを使用してパス上でアイテムを移動させる機能はサポートされていません。PathViewのcurrentIndex プロパティを変更するには、ボタンを使用してください。

たとえば、ContactModel.qml ファイルに次のような単純なリストモデルが定義されているとします。

ListModel {
    ListElement {
        name: "Bill Jones"
        icon: "qtlogo.png"
    }
    ListElement {
        name: "Jane Doe"
        icon: "qtlogo.png"
    }
    ListElement {
        name: "John Smith"
        icon: "qtlogo.png"
    }
}

このデータは、次のように PathView として表現できます：

Rectangle {
    PathView {
        model: model1
        // Note, pathItemCount should be set to a value larger than 0
        pathItemCount: 3
        path: Path {
            startX: 120; startY: 100
            PathQuad { x: 120; y: 25; controlX: 260; controlY: 75 }
            PathQuad { x: 120; y: 100; controlX: -20; controlY: 75 }
        }
        delegate: Item {
            id: wrapper
            height: 100
            width: 100
            required property string icon
            required property string name
            required property int index
            readonly property bool isCurrent: PathView.isCurrentItem

            opacity: isCurrent ? 1 : 0.5
            // Note: to keep the current item on top of the others change the z value
            z: isCurrent ? 1 : 0

            Image {
                anchors.horizontalCenter: nameText.horizontalCenter
                width: 64; height: 64
                source: wrapper.icon
            }

            Text {
                id: nameText
                text: wrapper.name
                font.pointSize: 16
                anchors.bottom: parent.bottom
            }
        }
    }
}

楕円形のパスに沿って配置された3つのコンタクト項目を表示するPathView。各項目には、Qtのロゴアイコンと名前が表示されています。

PathViewは、ナビゲーションキーがパスの形状に依存するため、キーボードによるナビゲーションを自動的に処理しません。代わりに、decrementCurrentIndex またはincrementCurrentIndex を使用して現在のインデックスを変更し、ボタンを通じてPathView内の項目間を移動するようにしてください。

PathView {
    // ...
    Button {
        text: "Previous"
        onClicked: pathView.decrementCurrentIndex()
    }
    Button {
        text: "Next"
        onClicked: pathView.incrementCurrentIndex()
    }
    // the Keys.* with the focus property is not supported in \QUL
    // focus: true
    // Keys.onLeftPressed: decrementCurrentIndex()
    // Keys.onRightPressed: incrementCurrentIndex()
}

Qt Quick のように、デリゲートに状態情報を保存しないでください。Ultraliteはいつでもデリゲートをインスタンス化および破棄するためです。

Qt Quick Ultraliteはデリゲートに対して固定サイズを静的に割り当てており、pathItemCount プロパティを使用してそのサイズを定義できます。サイズは0より大きい値にする必要があり、これはパス上で任意の時点で表示可能な項目の最大数を表します。モデルの項目数がpathItemCount よりも少ない場合、PathViewはそれに応じてデリゲートの数を調整します。

PathViewは、デリゲートのルートアイテムにPathView.isCurrentItem プロパティをアタッチします。次の例では、ルートデリゲートアイテムはPathView.isCurrentItem としてアタッチされたプロパティに直接アクセスできますが、子nameText オブジェクトがプロパティにアクセスするには、追加の修飾子が必要となります

Component {
    id: delegate
    Column {
        id: wrapper

        required property url icon
        required property string name

        opacity: PathView.isCurrentItem ? 1 : 0.5

        Image {
            anchors.horizontalCenter: nameText.horizontalCenter
            width: 64; height: 64
            source: wrapper.icon
        }
        Text {
            id: nameText
            text: wrapper.name + (wrapper.PathView.isCurrentItem ? " (current)" : "")
            font.pointSize: 16
        }
    }
}

重要な注意事項

PathView.isCurrentItem を使用して、現在の項目を `Qt Quick ` として強調表示します。Ultralite では、highlightItem はまだサポートされていません。
PathView では、クリップは自動的に有効になりません。ビューが別のアイテムや画面によってクリップされていない場合は、clip: true を設定して、ビューポートの外側にあるアイテムをクリップしてください。

関連項目： Path 、ListModel 、ListView 、 Qt Quick Ultralite のモデルとビュー、およびC++ データモデル。

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

count : int

このプロパティには、モデルに含まれる項目の数が格納されます。

currentIndex : int

このプロパティは、現在の項目のインデックスを保持します。

delegate : Component

デリゲートは、ビューによってインスタンス化される各項目を定義するテンプレートを提供します。インデックスは、index プロパティとしてアクセス可能です。また、ListModel の型に応じて、モデルのプロパティも利用可能です。

注： PathView は、ルートのサイズに基づいて項目のレイアウトを行います。

以下にデリゲートの例を示します：

        delegate: Item {
            id: wrapper
            height: 100
            width: 100
            required property string icon
            required property string name
            required property int index
            readonly property bool isCurrent: PathView.isCurrentItem

            opacity: isCurrent ? 1 : 0.5
            // Note: to keep the current item on top of the others change the z value
            z: isCurrent ? 1 : 0

            Image {
                anchors.horizontalCenter: nameText.horizontalCenter
                width: 64; height: 64
                source: wrapper.icon
            }

            Text {
                id: nameText
                text: wrapper.name
                font.pointSize: 16
                anchors.bottom: parent.bottom
            }
        }
    }

model : model

このプロパティは、ビューにデータを提供するモデルを保持します。

モデルは、ビューのアイテムを作成するために使用される一連のデータを提供します。大規模または動的なデータセットには C++ モデルを、単純なデータセットには `ListModel ` 型に基づく QML モデルを使用してください。

注： model を変更すると 、offsetおよびcurrentIndex が0 にリセットされます。

「ListModel」も参照してください。

path : Path

このプロパティには、アイテムのレイアウトに使用されるパスが格納されます。

「Path」も参照してください。

pathItemCount : int

このプロパティは、パス上で常に表示されているアイテムの数を保持します。

Qt Quick Ultralite はこのプロパティを使用して、デリゲートを静的に割り当てることも行います。モデル内のアイテム数が `pathItemCount` よりも少ない場合、必要な数のデリゲートインスタンスのみを使用します。

preferredHighlightBegin : real

preferredHighlightEnd : real

これらのプロパティは、ビュー内でのハイライト（現在の項目）の優先範囲を設定します。優先値は、0 から1 の範囲内である必要があります。

注：アニメーション およびタッチジェスチャはまだサポートされていないため、常にデフォルトのPathView.StrictlyEnforceRange が使用されます。つまり、currentItem が範囲の開始位置となります。

ハイライト範囲を定義することで、ビューが移動した際に現在のアイテムがどこに配置されるかを制御できます。たとえば、現在選択されているアイテムをパスの中央に配置したい場合は、ハイライト範囲を0.5,0.5 に設定します。

注: 有効な範囲とするには 、preferredHighlightEnd がpreferredHighlightBegin 以上である必要があります。

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

PathView.isCurrentItem : bool `[read-only]`

この関連プロパティは、デリゲートが現在の項目である場合は `true ` となり、そうでない場合は `false` となります。このプロパティは、デリゲートの各インスタンスに関連付けられています。

現在の項目とは、PathView のcurrentIndex プロパティと同じインデックスを持つデリゲート項目です。

このプロパティは、現在の項目の外観を調整するために使用できます。

        delegate: Item {
            id: wrapper
            height: 100
            width: 100
            required property string icon
            required property string name
            required property int index
            readonly property bool isCurrent: PathView.isCurrentItem

            opacity: isCurrent ? 1 : 0.5
            // Note: to keep the current item on top of the others change the z value
            z: isCurrent ? 1 : 0

            Image {
                anchors.horizontalCenter: nameText.horizontalCenter
                width: 64; height: 64
                source: wrapper.icon
            }

            Text {
                id: nameText
                text: wrapper.name
                font.pointSize: 16
                anchors.bottom: parent.bottom
            }
        }
    }

メソッドのドキュメント

void decrementCurrentIndex()

現在のインデックスを1減らします。

注：このメソッドは、コンポーネントの処理が完了した後にのみ呼び出してください 。

void incrementCurrentIndex()

現在のインデックスを1増やします。

注：このメソッドは、コンポーネントの処理が完了した後にのみ呼び出してください 。

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

C

PathView QML Type

プロパティ

関連するプロパティ

方法

詳細な説明

重要な注意事項

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

count : int

currentIndex : int

delegate : Component

model : model

path : Path

pathItemCount : int

preferredHighlightBegin : real

preferredHighlightEnd : real

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

PathView.isCurrentItem : bool [read-only]

メソッドのドキュメント

void decrementCurrentIndex()

void incrementCurrentIndex()

PathView.isCurrentItem : bool `[read-only]`