C
PathView QML Type
モデル内のアイテムをパス上に配置します。詳細...
| Import Statement: | import QtQuick |
| Since: | Qt Quick Ultralite 2.12 |
| Inherits: |
プロパティ
- count : int
- currentIndex : int
- delegate : Component
- model : model
- path : Path
- pathItemCount : int
- preferredHighlightBegin : real
- preferredHighlightEnd : real
関連するプロパティ
- isCurrentItem : bool
方法
- 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
}
}
}
}
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` よりも少ない場合、必要な数のデリゲートインスタンスのみを使用します。
これらのプロパティは、ビュー内でのハイライト(現在の項目)の優先範囲を設定します。優先値は、0 から1 の範囲内である必要があります。
注:アニメーション およびタッチジェスチャーは現時点ではサポートされていないため、常にデフォルト値のPathView.StrictlyEnforceRange が使用されます。つまり、currentItem が範囲の開始位置となります。
ハイライト範囲を定義することで、ビューが移動した際に現在のアイテムがどこに配置されるかを制御できます。たとえば、現在選択されているアイテムをパスの中央に配置したい場合は、ハイライト範囲を0.5,0.5 に設定します。
注: 有効な範囲とするには 、preferredHighlightEnd がpreferredHighlightBegin 以上である必要があります。
添付のプロパティのドキュメント
PathView.isCurrentItem : bool [read-only attached]
この添付プロパティは、デリゲートが現在の項目である場合は `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 ライセンス下で利用可能です。
詳細はこちらをご覧ください。