SwipeDelegate QML Type

Swipable Item Delegate. Mehr...

Import Statement: import QtQuick.Controls
Inherits:

ItemDelegate

Eigenschaften

Beigefügte Eigenschaften

  • pressed : bool (since QtQuick.Controls 2.1 (Qt 5.8))

Signale

Angehängte Signale

  • clicked() (since QtQuick.Controls 2.1 (Qt 5.8))

Methoden

  • void swipe.close() (since QtQuick.Controls 2.1 (Qt 5.8))
  • void swipe.open(enumeration side) (since QtQuick.Controls 2.2 (Qt 5.9))

Ausführliche Beschreibung

SwipeDelegate stellt ein Ansichtselement dar, das nach links oder rechts gestrichen werden kann, um weitere Optionen oder Informationen zu erhalten. Es wird als Delegat in Ansichten wie ListView verwendet.

Im folgenden Beispiel wird SwipeDelegate in einer ListView verwendet, damit Elemente durch Streichen nach links entfernt werden können:

ListView {
    id: listView
    anchors.fill: parent
    model: ListModel {
        ListElement { sender: "Bob Bobbleton"; title: "How are you going?" }
        ListElement { sender: "Rug Emporium"; title: "SALE! All rugs MUST go!" }
        ListElement { sender: "Electric Co."; title: "Electricity bill 15/07/2016 overdue" }
        ListElement { sender: "Tips"; title: "Five ways this tip will save your life" }
    }
    delegate: SwipeDelegate {
        id: swipeDelegate
        text: sender + " - " + title
        width: listView.width

        required property string sender
        required property string title
        required property int index

        ListView.onRemove: SequentialAnimation {
            PropertyAction {
                target: swipeDelegate
                property: "ListView.delayRemove"
                value: true
            }
            NumberAnimation {
                target: swipeDelegate
                property: "height"
                to: 0
                easing.type: Easing.InOutQuad
            }
            PropertyAction {
                target: swipeDelegate
                property: "ListView.delayRemove"
                value: false
            }
        }

        swipe.right: Label {
            id: deleteLabel
            text: qsTr("Delete")
            color: "white"
            verticalAlignment: Label.AlignVCenter
            padding: 12
            height: parent.height
            anchors.right: parent.right

            SwipeDelegate.onClicked: listView.model.remove(index)

            background: Rectangle {
                color: deleteLabel.SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"
            }
        }
    }
}

SwipeDelegate erbt seine API von ItemDelegate, die von AbstractButton geerbt wird. Sie können zum Beispiel text setzen und auf clicks mit der API AbstractButton reagieren.

Informationen über den Fortschritt eines Wischvorgangs sowie die Komponenten, die beim Wischen angezeigt werden sollen, sind beide über das gruppierte Eigenschaftsobjekt swipe verfügbar. Zum Beispiel enthält swipe.position die Position des Wischens innerhalb des Bereichs -1.0 bis 1.0. Die Eigenschaft swipe.left bestimmt, welches Element angezeigt wird, wenn das Steuerelement nach rechts gewischt wird, und umgekehrt für swipe.right. Die Positionierung dieser Komponenten ist den Anwendungen überlassen. Wenn Sie beispielsweise keine Position für swipe.left oder swipe.right angeben, geschieht Folgendes:

Wenn swipe.left und swipe.right links bzw. rechts vom Element background verankert sind, verhalten sie sich wie folgt:

Bei der Verwendung von swipe.left und swipe.right kann das Steuerelement nicht über den linken und rechten Rand hinaus gestrichen werden. Um diese Art von "Wrapping"-Verhalten zu erreichen, setzen Sie stattdessen swipe.behind. Dies führt dazu, dass dasselbe Element angezeigt wird, unabhängig davon, in welche Richtung das Steuerelement gestrichen wird. In der folgenden Abbildung wird beispielsweise swipe.behind eingestellt und das Steuerelement dann wiederholt in beide Richtungen gestrichen:

Siehe auch SwipeDelegate anpassen, Delegate Controls und Gallery Example.

Dokumentation der Eigenschaft

swipe group

swipe.behind : Component

swipe.behindItem : Item

swipe.complete : bool

swipe.enabled : bool

swipe.left : Component

swipe.leftItem : Item

swipe.position : real

swipe.right : Component

swipe.rightItem : Item

swipe.transition : Transition

NameBeschreibung
PositionDiese schreibgeschützte Eigenschaft enthält die Position des Wischens relativ zu den beiden Seiten des Steuerelements. Wenn dieser Wert entweder -1.0 (linke Seite) oder 1.0 (rechte Seite) erreicht und die Maustaste losgelassen wird, wird complete zu true.
vollständigDiese schreibgeschützte Eigenschaft gibt an, ob das Steuerelement nach dem Streichen nach links oder rechts vollständig sichtbar ist.

Wenn complete true ist, werden alle interaktiven Elemente, die in left, right oder behind deklariert sind, Mausereignisse empfangen.

aktiviertDiese Eigenschaft legt fest, ob das Steuerelement gestrichen werden kann oder nicht.

Diese Eigenschaft wurde in QtQuick hinzugefügt. Controls 2.2.

leftDiese Eigenschaft enthält den linken Delegaten.

Der linke Delegat befindet sich hinter contentItem und background. Wenn die SwipeDelegate nach rechts gestrichen wird, wird dieses Element nach und nach sichtbar.

Hier können sowohl interaktive als auch nicht interaktive Elemente verwendet werden. Es gelten die normalen Regeln für die Ereignisbehandlung; wenn ein interaktives Steuerelement wie Button verwendet wird, werden Interaktionssignale von SwipeDelegate wie clicked() nicht ausgegeben, wenn die Schaltfläche angeklickt wird.

hinterDiese Eigenschaft enthält den Delegaten, der angezeigt wird, wenn SwipeDelegate sowohl nach links als auch nach rechts gestrichen wird.

Wie bei den Delegaten left und right befindet er sich hinter contentItem und background. Ein SwipeDelegate, dessen behind gesetzt wurde, kann jedoch kontinuierlich von beiden Seiten gestrichen werden und zeigt immer dasselbe Element.

Hier können sowohl interaktive als auch nicht interaktive Elemente verwendet werden. Es gelten die normalen Regeln für die Ereignisbehandlung; wenn ein interaktives Steuerelement wie Button verwendet wird, werden Interaktionssignale von SwipeDelegate wie clicked() nicht ausgegeben, wenn die Schaltfläche angeklickt wird.

rechtsDiese Eigenschaft enthält den rechten Delegaten.

Der rechte Delegat befindet sich hinter contentItem und background. Wenn die SwipeDelegate nach links gestrichen wird, wird dieses Element nach und nach sichtbar.

Hier können sowohl interaktive als auch nicht interaktive Elemente verwendet werden. Es gelten die normalen Regeln für die Ereignisbehandlung; wenn ein interaktives Steuerelement wie Button verwendet wird, werden Interaktionssignale von SwipeDelegate wie clicked() nicht ausgegeben, wenn die Schaltfläche angeklickt wird.

leftItemDiese schreibgeschützte Eigenschaft enthält das Element, das von der Komponente left instanziiert wurde.

Wenn left nicht gesetzt wurde oder sich die Position seit der Erstellung von SwipeDelegate nicht geändert hat, wird diese Eigenschaft null sein.

behindItemDiese schreibgeschützte Eigenschaft enthält das Element, das aus der Komponente behind instanziiert wurde.

Wenn behind nicht festgelegt wurde oder die Position seit der Erstellung von SwipeDelegate nicht geändert wurde, lautet diese Eigenschaft null.

rightItemDiese schreibgeschützte Eigenschaft enthält das Element, das aus der Komponente right instanziiert wurde.

Wenn right nicht festgelegt wurde oder die Position seit der Erstellung von SwipeDelegate nicht geändert wurde, lautet diese Eigenschaft null.

ÜbergangDiese Eigenschaft enthält den Übergang, der angewendet wird, wenn eine Wischbewegung losgelassen wird oder swipe.open() oder swipe.close() aufgerufen wird.
SwipeDelegate {
    swipe.transition: Transition {
        SmoothedAnimation { velocity: 3; easing.type: Easing.InOutCubic }
    }
}

Diese Eigenschaft wurde in Qt Quick Controls 2.2 hinzugefügt.

Siehe auch contentItem, background, swipe.open(), und swipe.close().


Dokumentation der angehängten Eigenschaft

SwipeDelegate.pressed : bool [read-only, since QtQuick.Controls 2.1 (Qt 5.8)]

Diese Eigenschaft kann an ein nicht interaktives Element angehängt werden, das in swipe.left, swipe.right oder swipe.behind deklariert ist, um zu erkennen, ob es gedrückt wird. Elemente können nur gedrückt werden, wenn swipe.complete true ist.

Ein Beispiel:

swipe.right: Label {
    anchors.right: parent.right
    height: parent.height
    text: "Action"
    color: "white"
    padding: 12
    background: Rectangle {
        color: SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"
    }
}

Es ist möglich, mehrere Elemente zu haben, die einzeln Maus- und Berührungsereignisse empfangen. Um zum Beispiel zwei Aktionen im Element swipe.right zu haben, verwenden Sie den folgenden Code:

swipe.right: Row {
    anchors.right: parent.right
    height: parent.height

    Label {
        id: moveLabel
        text: qsTr("Move")
        color: "white"
        verticalAlignment: Label.AlignVCenter
        padding: 12
        height: parent.height

        SwipeDelegate.onClicked: console.log("Moving...")

        background: Rectangle {
            color: moveLabel.SwipeDelegate.pressed ? Qt.darker("#ffbf47", 1.1) : "#ffbf47"
        }
    }
    Label {
        id: deleteLabel
        text: qsTr("Delete")
        color: "white"
        verticalAlignment: Label.AlignVCenter
        padding: 12
        height: parent.height

        SwipeDelegate.onClicked: console.log("Deleting...")

        background: Rectangle {
            color: deleteLabel.SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"
        }
    }
}

Beachten Sie, dass die Zuweisung color in jedem Element background die angehängte Eigenschaft mit der id des Etiketts qualifiziert. Dies ist wichtig, denn die Verwendung der angehängten Eigenschaften für ein Element bewirkt, dass dieses Element Ereignisse akzeptiert. Nehmen wir an, wir hätten das id im vorherigen Beispiel weggelassen:

color: SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"

Das Hintergrundelement Rectangle ist ein untergeordnetes Element der Beschriftung, so dass es natürlich Ereignisse vor ihr empfängt. In der Praxis bedeutet dies, dass sich die Hintergrundfarbe ändert, aber der onClicked Handler im Label nie aufgerufen wird.

Für interaktive Steuerelemente (wie z. B. Button), die in diesen Elementen deklariert sind, verwenden Sie stattdessen die entsprechende Eigenschaft pressed.

Für das Drücken auf SwipeDelegate selbst, verwenden Sie die Eigenschaft pressed.

Diese Eigenschaft wurde in QtQuick.Controls 2.1 (Qt 5.8) eingeführt.

Siehe auch clicked().


Signal-Dokumentation

[since QtQuick.Controls 2.2 (Qt 5.9)] void swipe.closed()

Dieses Signal wird ausgegeben, wenn das Delegat durch Wischen geschlossen wurde und der Übergang abgeschlossen ist.

Es ist nützlich, um eine Aktion nach dem Abbruch eines Wischvorgangs auszuführen. Zum Beispiel kann es verwendet werden, um das Entfernen des Delegaten aus der Liste, in der er sich befindet, abzubrechen.

Hinweis: Der entsprechende Handler ist swipe.onClosed.

Dieses Signal wurde in QtQuick.Controls 2.2 (Qt 5.9) eingeführt.

Siehe auch swipe und swipe.opened().


[since QtQuick.Controls 2.1 (Qt 5.8)] void swipe.completed()

Dieses Signal wird ausgesendet, wenn swipe.complete zu true wird.

Es ist nützlich für die Durchführung einer Aktion nach Abschluss eines Wischvorgangs. Zum Beispiel kann es verwendet werden, um den Delegierten aus der Liste zu entfernen, in der er sich befindet.

Hinweis: Der entsprechende Handler ist swipe.onCompleted.

Dieses Signal wurde in QtQuick.Controls 2.1 (Qt 5.8) eingeführt.

Siehe auch swipe.


[since QtQuick.Controls 2.2 (Qt 5.9)] void swipe.opened()

Dieses Signal wird ausgegeben, wenn das Delegat aufgestrichen wurde und der Übergang abgeschlossen ist.

Es ist nützlich, um eine Aktion nach Abschluss eines Wischvorgangs auszuführen. Zum Beispiel kann es verwendet werden, um den Delegaten aus der Liste zu entfernen, in der er sich befindet.

Hinweis: Der entsprechende Handler ist swipe.onOpened.

Dieses Signal wurde in QtQuick.Controls 2.2 (Qt 5.9) eingeführt.

Siehe auch swipe und swipe.closed().


Dokumentation zum angehängten Signal

[since QtQuick.Controls 2.1 (Qt 5.8)] clicked()

Dieses Signal kann an ein nicht interaktives Element angehängt werden, das in swipe.left, swipe.right oder swipe.behind deklariert ist, um auf Klicks zu reagieren. Elemente können nur angeklickt werden, wenn swipe.complete true ist.

Für interaktive Steuerelemente (wie z. B. Button), die in diesen Elementen deklariert sind, verwenden Sie stattdessen das entsprechende clicked() Signal.

Um auf Klicks auf SwipeDelegate selbst zu reagieren, verwenden Sie das Signal clicked().

Hinweis: Informationen zur korrekten Verwendung der ereignisbezogenen Eigenschaften finden Sie in der Dokumentation zu pressed.

Hinweis: Der entsprechende Handler ist onClicked.

Dieses Signal wurde in QtQuick.Controls 2.1 (Qt 5.8) eingeführt.

Siehe auch pressed.


Dokumentation der Methode

[since QtQuick.Controls 2.1 (Qt 5.8)] void swipe.close()

Diese Methode setzt die position der Wischbewegung auf 0. Alle Animationen, die für die x Position von contentItem und background definiert wurden, werden ausgelöst.

Diese Methode wurde in QtQuick.Controls 2.1 (Qt 5.8) eingeführt.

Siehe auch swipe und swipe.open().


[since QtQuick.Controls 2.2 (Qt 5.9)] void swipe.open(enumeration side)

Diese Methode stellt die position so ein, dass sie von der angegebenen side geöffnet wird.

Verfügbare Werte:

KonstanteBeschreibung
SwipeDelegate.Leftposition wird auf 1 gesetzt, so dass der Swipe von links geöffnet wird. Es muss entweder swipe.left oder swipe.behind angegeben worden sein; andernfalls wird der Aufruf ignoriert.
SwipeDelegate.RightDer Wert position wird auf -1 gesetzt, wodurch der Wisch von rechts geöffnet wird. Es muss entweder swipe.right oder swipe.behind angegeben worden sein, andernfalls wird der Aufruf ignoriert.

Alle Animationen, die für die x Position von contentItem und background definiert wurden, werden ausgelöst.

Diese Methode wurde in QtQuick.Controls 2.2 (Qt 5.9) eingeführt.

Siehe auch swipe und swipe.close().


© 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.