PathView QML Type
Legt die vom Modell bereitgestellten Elemente auf einen Pfad. Mehr...
Import Statement: | import QtQuick |
Inherits: |
Eigenschaften
- cacheItemCount : int
- count : int
- currentIndex : int
- currentItem : Item
- delegate : Component
- dragMargin : real
- dragging : bool
- flickDeceleration : real
- flicking : bool
- highlight : Component
- highlightItem : Item
- highlightMoveDuration : int
- highlightRangeMode : enumeration
- interactive : bool
- maximumFlickVelocity : real
- model : model
- movementDirection : enumeration
- moving : bool
- offset : real
- path : Path
- pathItemCount : int
- preferredHighlightBegin : real
- preferredHighlightEnd : real
- snapMode : enumeration
Beigefügte Eigenschaften
- isCurrentItem : bool
- onPath : bool
- view : PathView
Signale
Methoden
- decrementCurrentIndex()
- incrementCurrentIndex()
- int indexAt(real x, real y)
- Item itemAt(real x, real y)
- Item itemAtIndex(int index)
- positionViewAtIndex(int index, PositionMode mode)
Detaillierte Beschreibung
Eine PathView zeigt Daten von Modellen an, die von eingebauten QML-Typen wie ListModel und XmlListModel erstellt wurden, oder von benutzerdefinierten Modellklassen, die in C++ definiert sind und von QAbstractListModel erben.
Die Ansicht hat eine model, die die anzuzeigenden Daten definiert, und eine delegate, die definiert, wie die Daten angezeigt werden sollen. Die delegate wird für jedes Element auf der path instanziiert. Die Elemente können durch Anklicken entlang des Pfades verschoben werden.
Zum Beispiel, wenn ein einfaches Listenmodell in einer Datei ContactModel.qml
wie folgt definiert ist:
import QtQuick ListModel { ListElement { name: "Bill Jones" icon: "pics/qtlogo.png" } ListElement { name: "Jane Doe" icon: "pics/qtlogo.png" } ListElement { name: "John Smith" icon: "pics/qtlogo.png" } }
Diese Daten können als PathView dargestellt werden, etwa so:
import QtQuick Rectangle { width: 240; height: 200 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 font.pointSize: 16 } } } PathView { anchors.fill: parent model: ContactModel {} delegate: delegate path: Path { startX: 120; startY: 100 PathQuad { x: 120; y: 25; controlX: 260; controlY: 75 } PathQuad { x: 120; y: 100; controlX: -20; controlY: 75 } } } }
(Beachten Sie, dass das obige Beispiel PathAttribute verwendet, um die Deckkraft der Elemente zu skalieren und zu ändern, während sie sich drehen. Dieser zusätzliche Code kann in der PathAttribute Dokumentation nachgelesen werden).
PathView verarbeitet die Tastaturnavigation nicht automatisch. Das liegt daran, dass die für die Navigation zu verwendenden Tasten von der Form des Pfades abhängen. Die Navigation kann ganz einfach hinzugefügt werden, indem man focus
auf true
setzt und decrementCurrentIndex() oder incrementCurrentIndex() aufruft, um z. B. mit den linken und rechten Pfeiltasten zu navigieren:
PathView { // ... focus: true Keys.onLeftPressed: decrementCurrentIndex() Keys.onRightPressed: incrementCurrentIndex() }
Die Pfadansicht selbst ist ein Fokusbereich (siehe Tastaturfokus in Qt Quick für weitere Details).
Delegates werden nach Bedarf instanziiert und können jederzeit zerstört werden. Der Status sollte niemals in einem Delegaten gespeichert werden.
PathView fügt eine Reihe von Eigenschaften an das Root-Element des Delegaten an, zum Beispiel PathView.isCurrentItem
. Im folgenden Beispiel kann das Stammelement des Delegaten direkt auf diese angehängte Eigenschaft als PathView.isCurrentItem
zugreifen, während das untergeordnete Objekt nameText
auf diese Eigenschaft als wrapper.PathView.isCurrentItem
verweisen muss.
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 font.pointSize: 16 } } }
Beachten Sie, dass Ansichten das Clipping nicht automatisch aktivieren. Wenn die Ansicht nicht durch ein anderes Element oder den Bildschirm beschnitten wird, muss clip: true gesetzt werden, damit die Elemente außerhalb der Ansicht gut beschnitten werden.
Siehe auch Path, QML-Datenmodelle, ListView, GridView, und Qt Quick Beispiele - Ansichten.
Dokumentation der Eigenschaft
highlightRangeMode : enumeration |
preferredHighlightBegin : real |
preferredHighlightEnd : real |
Diese Eigenschaften legen den bevorzugten Bereich der Markierung (aktuelles Element) innerhalb der Ansicht fest. Die bevorzugten Werte müssen im Bereich von 0
bis 1
liegen.
Gültige Werte für highlightRangeMode
sind:
Konstante | Beschreibung |
---|---|
PathView.NoHighlightRange | Es wird kein Bereich angewendet: Die Markierung bewegt sich frei innerhalb der Ansicht. |
PathView.ApplyRange | Die Ansicht versucht, die Markierung innerhalb des Bereichs zu halten, aber die Markierung kann sich an den Enden des Pfads oder aufgrund einer Mausinteraktion außerhalb des Bereichs bewegen. |
PathView.StrictlyEnforceRange | Die Markierung wird sich niemals außerhalb des Bereichs bewegen. Das bedeutet, dass sich das aktuelle Element ändert, wenn eine Tastatur- oder Mausaktion dazu führen würde, dass sich die Markierung außerhalb des Bereichs bewegt. |
Der Standardwert ist PathView.StrictlyEnforceRange.
Das Definieren eines Hervorhebungsbereichs ist der richtige Weg, um zu beeinflussen, wo das aktuelle Element landet, wenn sich die Ansicht bewegt. Wenn Sie beispielsweise möchten, dass sich das aktuell ausgewählte Element in der Mitte des Pfads befindet, setzen Sie den Markierungsbereich auf 0.5,0.5 und highlightRangeMode auf PathView.StrictlyEnforceRange. Wenn der Pfad gescrollt wird, ist das aktuell ausgewählte Element das Element an dieser Position. Dies gilt auch, wenn sich das aktuell ausgewählte Element ändert - es wird innerhalb des bevorzugten Markierungsbereichs verschoben. Außerdem verhält sich der aktuelle Elementindex unabhängig davon, ob eine Markierung vorhanden ist oder nicht.
Hinweis: Für einen gültigen Bereich muss preferredHighlightEnd
größer oder gleich preferredHighlightBegin
sein.
cacheItemCount : int |
Diese Eigenschaft gibt die maximale Anzahl der Elemente an, die außerhalb des Pfades zwischengespeichert werden sollen.
Ein PathView mit einem Modell, das 20 Elemente enthält, einer pathItemCount von 10 und einer cacheItemCount von 4 wird beispielsweise bis zu 14 Elemente erstellen, wobei 10 Elemente auf dem Pfad sichtbar und 4 Elemente unsichtbar im Cache gespeichert sind.
Die zwischengespeicherten Delegaten werden asynchron erstellt, so dass die Erstellung über mehrere Frames hinweg erfolgen kann und die Wahrscheinlichkeit des Überspringens von Frames verringert wird.
Hinweis: Die Einstellung dieser Eigenschaft ist kein Ersatz für die Erstellung effizienter Delegaten. Sie kann die Glätte des Bildlaufverhaltens auf Kosten der zusätzlichen Speichernutzung verbessern. Je weniger Objekte und Bindungen in einem Delegaten vorhanden sind, desto schneller kann eine Ansicht gescrollt werden. Es ist wichtig zu erkennen, dass das Setzen von cacheItemCount nur Probleme, die durch langsam ladende Delegaten verursacht werden, verschiebt, es ist keine Lösung für dieses Szenario.
Siehe auch pathItemCount.
count : int |
Diese Eigenschaft enthält die Anzahl der Elemente im Modell.
currentIndex : int |
Diese Eigenschaft enthält den Index des aktuellen Elements.
currentItem : Item |
Diese Eigenschaft enthält das aktuelle Element in der Ansicht.
delegate : Component |
Der Delegat bietet eine Vorlage, die jedes Element definiert, das von der Ansicht instanziiert wird. Der Index ist als zugängliche index
Eigenschaft verfügbar. Eigenschaften des Modells sind je nach Art des Datenmodells ebenfalls verfügbar.
Die Anzahl der Objekte und Bindungen im Delegaten hat eine direkte Auswirkung auf die Flicking-Leistung der Ansicht, wenn pathItemCount angegeben ist. Wenn möglich, platzieren Sie Funktionalität, die für die normale Anzeige des Delegaten nicht benötigt wird, in einem Loader, der bei Bedarf zusätzliche Komponenten laden kann.
Beachten Sie, dass die PathView die Elemente auf der Grundlage der Größe des Stammelements im Delegaten anordnet.
Hier ist ein Beispiel-Delegat:
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 font.pointSize: 16 } } }
dragMargin : real |
Diese Eigenschaft enthält den maximalen Abstand vom Pfad, der das Ziehen mit der Maus auslöst.
Standardmäßig kann der Pfad nur durch Klicken auf ein Element gezogen werden. Wenn dragMargin größer als Null ist, kann ein Ziehen durch Klicken innerhalb von dragMargin Pixeln des Pfades initiiert werden.
dragging : bool |
Diese Eigenschaft gibt an, ob sich die Ansicht aufgrund des Ziehens durch den Benutzer gerade bewegt.
flickDeceleration : real |
Diese Eigenschaft gibt die Geschwindigkeit an, mit der ein Flick verlangsamt wird.
Der Standardwert ist 100.
flicking : bool |
Diese Eigenschaft gibt an, ob sich die Ansicht gerade bewegt, wenn der Benutzer die Ansicht anklickt.
highlight : Component |
Diese Eigenschaft enthält die Komponente, die als Hervorhebung verwendet wird.
Eine Instanz der Highlight-Komponente wird für jede Ansicht erstellt. Die Geometrie der resultierenden Komponenteninstanz wird von der Ansicht so verwaltet, dass sie beim aktuellen Element bleibt.
Das folgende Beispiel zeigt, wie man eine einfache Hervorhebung erstellt. Beachten Sie die Verwendung der Eigenschaft PathView.onPath attached, um sicherzustellen, dass das Highlight ausgeblendet wird, wenn es vom Pfad weggeschoben wird.
Component { Rectangle { visible: PathView.onPath // ... } }
Siehe auch highlightItem und highlightRangeMode.
highlightItem : Item |
highlightMoveDuration : int |
Diese Eigenschaft enthält die Dauer der Bewegungsanimation des Hervorhebungsdelegaten.
Wenn highlightRangeMode StrictlyEnforceRange ist, bestimmt diese Eigenschaft die Geschwindigkeit, mit der sich die Elemente entlang des Pfades bewegen.
Der Standardwert für die Dauer ist 300 ms.
interactive : bool |
maximumFlickVelocity : real |
Diese Eigenschaft enthält die ungefähre maximale Geschwindigkeit, mit der der Benutzer die Ansicht in Pixel/Sekunde bewegen kann.
Der Standardwert ist plattformabhängig.
model : model |
Diese Eigenschaft enthält das Modell, das Daten für die Ansicht bereitstellt.
Das Modell stellt eine Reihe von Daten bereit, die zur Erstellung der Elemente für die Ansicht verwendet werden. Bei großen oder dynamischen Datensätzen wird das Modell normalerweise durch ein C++-Modellobjekt bereitgestellt. Modelle können auch direkt in QML erstellt werden, indem der Typ ListModel verwendet wird.
Hinweis: Wenn Sie das Modell ändern, werden der Offset und currentIndex auf 0 zurückgesetzt.
Siehe auch Datenmodelle.
movementDirection : enumeration |
Diese Eigenschaft bestimmt die Richtung, in die sich Elemente beim Setzen des aktuellen Indexes bewegen. Die möglichen Werte sind:
Konstant | Beschreibung |
---|---|
PathView.Shortest | (Standard) die Elemente bewegen sich in die Richtung, die die geringste Bewegung erfordert, also entweder Negative oder Positive . |
PathView.Negative | Die Elemente bewegen sich rückwärts in Richtung ihres Ziels. |
PathView.Positive | Die Objekte bewegen sich vorwärts in Richtung ihres Ziels. |
Nehmen wir zum Beispiel an, dass es 5 Gegenstände im Modell gibt und currentIndex auf 0
eingestellt ist. Wenn currentIndex auf 2
eingestellt ist,
- wird eine
Positive
Bewegungsrichtung in der folgenden Reihenfolge ergeben: 0, 1, 2 - eine
Negative
Bewegungsrichtung führt zu der folgenden Reihenfolge: 0, 5, 4, 3, 2 - eine
Shortest
Bewegungsrichtung ergibt die gleiche Reihenfolge wie beiPositive
.
Hinweis: Diese Eigenschaft hat keinen Einfluss auf die Bewegung von incrementCurrentIndex() und decrementCurrentIndex().
moving : bool |
Diese Eigenschaft gibt an, ob sich die Ansicht gerade bewegt, weil der Benutzer die Ansicht zieht oder anklickt.
offset : real |
Der Offset gibt an, wie weit sich die Elemente von ihrer Ausgangsposition entfernt befinden. Dies ist eine reelle Zahl, die von 0
bis zur Anzahl der Elemente im Modell reicht.
path : Path |
Diese Eigenschaft enthält den Pfad, der für die Anordnung der Elemente verwendet wird. Weitere Informationen finden Sie in der Dokumentation Path.
pathItemCount : int |
Diese Eigenschaft enthält die Anzahl der Elemente, die zu einem bestimmten Zeitpunkt auf dem Pfad sichtbar sind.
Wird pathItemCount auf undefiniert gesetzt, werden alle Elemente auf dem Pfad angezeigt.
snapMode : enumeration |
Diese Eigenschaft bestimmt, wie sich die Elemente nach dem Ziehen oder Schieben ausrichten. Die möglichen Werte sind:
Konstant | Beschreibung |
---|---|
PathView.NoSnap | (Standard) Die Elemente bleiben an einer beliebigen Stelle des Pfades stehen. |
PathView.SnapToItem | Die Elemente bleiben bei einem Element stehen, das mit preferredHighlightBegin ausgerichtet ist. |
PathView.SnapOneItem | Die Elemente werden nicht weiter als ein Element von dem Element entfernt, das sich zum Zeitpunkt des Loslassens der Taste am nächsten zu preferredHighlightBegin befindet. Dieser Modus ist besonders nützlich, um eine Seite nach der anderen zu verschieben. |
snapMode
hat keine Auswirkungen auf currentIndex. Um currentIndex zu aktualisieren, wenn die Ansicht verschoben wird, setzen Sie highlightRangeMode auf PathView.StrictlyEnforceRange
(Standardwert für PathView).
Siehe auch highlightRangeMode.
Dokumentation der angehängten Eigenschaft
PathView.isCurrentItem : bool |
Diese angehängte Eigenschaft ist wahr, wenn dieser Delegat das aktuelle Element ist; andernfalls falsch.
Sie wird an jede Instanz des Delegaten angehängt.
Diese Eigenschaft kann verwendet werden, um das Aussehen des aktuellen Elements anzupassen.
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 font.pointSize: 16 } } }
PathView.onPath : bool |
Diese angehängte Eigenschaft gibt an, ob sich das Element derzeit auf dem Pfad befindet.
Wenn ein pathItemCount gesetzt wurde, ist es möglich, dass einige Elemente instanziiert werden, aber nicht als aktuell auf dem Pfad betrachtet werden. Normalerweise würden diese Elemente z. B. auf unsichtbar gesetzt werden:
Component { Rectangle { visible: PathView.onPath // ... } }
Sie ist mit jeder Instanz des Delegaten verbunden.
PathView.view : PathView |
Diese angehängte Eigenschaft enthält die Ansicht, die diese Delegateninstanz verwaltet.
Sie ist an jede Instanz des Delegaten angehängt.
Signal Dokumentation
dragEnded() |
Dieses Signal wird ausgegeben, wenn der Benutzer das Ziehen der Ansicht beendet.
Wenn die Geschwindigkeit des Ziehens zum Zeitpunkt des Loslassens der Touch-/Maustaste ausreichend ist, wird ein Flick ausgelöst.
Hinweis: Der entsprechende Handler ist onDragEnded
.
dragStarted() |
Dieses Signal wird ausgegeben, wenn die Ansicht aufgrund einer Benutzerinteraktion zu ziehen beginnt.
Hinweis: Der entsprechende Handler ist onDragStarted
.
flickEnded() |
Dieses Signal wird ausgegeben, wenn sich die Ansicht aufgrund eines Schnipsens nicht mehr bewegt.
Hinweis: Der entsprechende Handler ist onFlickEnded
.
flickStarted() |
Dieses Signal wird ausgegeben, wenn die Ansicht geschoben wird. Eine Bewegung beginnt ab dem Zeitpunkt, an dem die Maus oder die Berührung losgelassen wird, während sie noch in Bewegung ist.
Hinweis: Der entsprechende Handler ist onFlickStarted
.
movementEnded() |
Dieses Signal wird ausgegeben, wenn sich die Ansicht aufgrund einer Benutzerinteraktion nicht mehr bewegt. Wenn ein Flick erzeugt wurde, wird dieses Signal ausgegeben, sobald der Flick aufhört. Wurde kein Flick generiert, wird dieses Signal ausgegeben, wenn der Benutzer aufhört zu ziehen, d.h. wenn die Maus oder der Touch losgelassen wird.
Hinweis: Der entsprechende Handler ist onMovementEnded
.
movementStarted() |
Dieses Signal wird ausgegeben, wenn sich die Ansicht aufgrund einer Benutzerinteraktion zu bewegen beginnt.
Hinweis: Der entsprechende Handler ist onMovementStarted
.
Dokumentation der Methode
decrementCurrentIndex() |
Verringert den aktuellen Index.
Hinweis: Die Methoden sollten erst aufgerufen werden, wenn die Component abgeschlossen ist.
incrementCurrentIndex() |
Erhöht den aktuellen Index.
Hinweis: Die Methoden sollten erst aufgerufen werden, nachdem die Komponente abgeschlossen ist.
Gibt den Index des Elements zurück, das den Punkt x enthält, y in Inhaltskoordinaten. Gibt es an dem angegebenen Punkt kein Element, wird -1 zurückgegeben.
Hinweis: Die Methoden sollten erst aufgerufen werden, wenn die Komponente abgeschlossen ist.
Gibt das Element zurück, das den Punkt x, y in Inhaltskoordinaten enthält. Befindet sich kein Element an dem angegebenen Punkt, wird null zurückgegeben.
Hinweis: Die Methoden sollten erst aufgerufen werden, nachdem die Komponente abgeschlossen ist.
Gibt das Element für index zurück. Wenn es für diesen Index kein Element gibt, z. B. weil es noch nicht erstellt wurde oder weil es aus dem sichtbaren Bereich geschwenkt und aus dem Cache entfernt wurde, wird null zurückgegeben.
Hinweis: Diese Methode sollte erst aufgerufen werden, wenn die Komponente abgeschlossen ist. Der zurückgegebene Wert sollte auch nicht gespeichert werden, da er zu null werden kann, sobald die Kontrolle den aufrufenden Bereich verlässt, wenn die Ansicht dieses Element freigibt.
positionViewAtIndex(int index, PositionMode mode) |
Positioniert die Ansicht so, dass sich die index an der durch mode angegebenen Position befindet:
Konstante | Beschreibung |
---|---|
PathView.Beginning | positioniert das Element am Anfang des Pfades. |
PathView.Center | position item in der Mitte des Pfades. |
PathView.End | Positioniere das Element am Ende des Pfades. |
PathView.Contain | stellt sicher, dass das Element auf dem Pfad positioniert ist. |
PathView.SnapPosition | Positionierung des Elements bei preferredHighlightBegin. Dieser Modus ist nur gültig, wenn highlightRangeMode StrictlyEnforceRange ist oder das Einrasten über snapMode aktiviert ist. |
Hinweis: Die Methoden sollten erst aufgerufen werden, wenn die Component abgeschlossen ist. Um die Ansicht beim Starten zu positionieren, sollte diese Methode von Component.onCompleted aufgerufen werden. Zum Beispiel, um die Ansicht am Ende zu positionieren:
Component.onCompleted: positionViewAtIndex(count - 1, PathView.End)
© 2025 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.