Qt Quick Staaten

Verwandte Typen

Viele Benutzeroberflächendesigns sind zustandsgesteuert; Schnittstellen haben Konfigurationen, die sich je nach dem aktuellen Zustand unterscheiden. Zum Beispiel konfiguriert ein Verkehrssignal seine Flaggen oder Lichter abhängig von seinem Zustand. Im Zustand stop leuchtet eine rote Ampel auf, während die gelbe und die grüne Ampel ausgeschaltet sind. Im Zustand caution ist die gelbe Ampel eingeschaltet, während die anderen Ampeln ausgeschaltet sind.

In QML sind Zustände ein Satz von Eigenschaftskonfigurationen, die in einem State Typ definiert sind. Unterschiedliche Konfigurationen können zum Beispiel sein:

• einige UI-Komponenten anzeigen und andere ausblenden
• dem Benutzer verschiedene verfügbare Aktionen präsentieren
• Animationen starten, anhalten oder pausieren
• Ausführen eines Skripts, das im neuen Zustand erforderlich ist
• einen Eigenschaftswert für ein bestimmtes Element ändern
• eine andere Ansicht oder einen anderen Bildschirm anzeigen

Alle Item-basierten Objekte haben eine state -Eigenschaft und können zusätzliche Zustände angeben, indem sie neue State -Objekte zu der states -Eigenschaft des Elements hinzufügen. Jeder Zustand innerhalb einer Komponente hat einen eindeutigen name, wobei eine leere Zeichenkette die Standardeinstellung ist. Um den aktuellen Zustand eines Elements zu ändern, setzen Sie die Eigenschaft state auf den Namen des Zustands.

Nicht-Element-Objekte können Zustände über den Typ StateGroup verwenden.

Erstellen von Zuständen

Um einen Zustand zu erstellen, fügen Sie ein State -Objekt zur states -Eigenschaft des Elements hinzu, das eine Liste der Zustände für dieses Element enthält.

Eine Warnung signal Komponente kann zwei Zustände haben, den NORMAL und den CRITICAL Zustand. Nehmen wir an, dass im Zustand NORMAL die color des Signals green sein sollte und die Warnung flag nicht aktiv ist. Im Zustand CRITICAL sollte color red und das Flag up sein. Wir können die Zustände mit dem Typ State und die Farb- und Flaggenkonfigurationen mit dem Typ PropertyChanges modellieren.

Rectangle {
    id: signal
    width: 200; height: 200
    state: "NORMAL"

    states: [
        State {
            name: "NORMAL"
            PropertyChanges { target: signal; color: "green"}
            PropertyChanges { target: flag; state: "FLAG_DOWN"}
        },
        State {
            name: "CRITICAL"
            PropertyChanges { target: signal; color: "red"}
            PropertyChanges { target: flag; state: "FLAG_UP"}
        }
    ]
}

Mit dem Typ PropertyChanges werden die Werte der Objekteigenschaften geändert. Objekte werden über ihre ID referenziert. Objekte außerhalb der Komponente werden ebenfalls über die Eigenschaft id referenziert, z. B. durch die Änderung der Eigenschaft des externen Objekts flag.

Außerdem kann sich der Zustand ändern, indem die Eigenschaft state mit dem entsprechenden Signalzustand belegt wird. Ein Zustandsschalter könnte vom Typ MouseArea sein, der jedes Mal, wenn das Signal einen Mausklick erhält, einen anderen Zustand zuweist.

Rectangle {
    id: signalswitch
    width: 75; height: 75
    color: "blue"

    MouseArea {
        anchors.fill: parent
        onClicked: {
            if (signal.state == "NORMAL")
                signal.state = "CRITICAL"
            else
                signal.state = "NORMAL"
        }
    }
}

Der Typ "State" ist nicht darauf beschränkt, Änderungen an Eigenschaftswerten vorzunehmen. Er kann auch:

• Ein Skript ausführen mit StateChangeScript
• einen bestehenden Signalhandler für ein Objekt überschreiben mit PropertyChanges
• Re-parent ein Item mit ParentChange
• Ändern von Ankerwerten mit AnchorChanges

Der Standardzustand

Jede auf Item basierende Komponente hat eine state Eigenschaft und einen Standardstatus. Der Standardzustand ist die leere Zeichenkette ("") und enthält alle anfänglichen Eigenschaftswerte eines Elements. Der Standardzustand ist nützlich für die Verwaltung von Eigenschaftswerten vor Zustandsänderungen. Wenn Sie die Eigenschaft state auf eine leere Zeichenfolge setzen, wird der Standardstatus geladen.

Die Eigenschaft when

Der Einfachheit halber verfügt der Typ State über eine Eigenschaft when, die an Ausdrücke gebunden werden kann, um den Zustand zu ändern, wenn der gebundene Ausdruck zu true ausgewertet wird. Die Eigenschaft when setzt den Zustand auf den Standardzustand zurück, wenn der Ausdruck zu false ausgewertet wird.

Rectangle {
    id: bell
    width: 75; height: 75
    color: "yellow"

    states: State {
                name: "RINGING"
                when: (signal.state == "CRITICAL")
                PropertyChanges {target: speaker; play: "RING!"}
            }
}

Die Komponente bell wechselt in den Zustand RINGING, wenn die Eigenschaft signal.state CRITICAL ist.

Animieren von Zustandsänderungen

Zustandsänderungen führen zu abrupten Wertänderungen. Der Typ Transition ermöglicht sanftere Änderungen bei Zustandswechseln. Bei Übergängen sind Animationen und Interpolationsverhalten definierbar. Der Artikel Animation und Übergänge enthält weitere Informationen zur Erstellung von Zustandsanimationen.

Das Beispiel Animation veranschaulicht, wie man einen grundlegenden Satz von Zuständen deklariert und animierte Übergänge zwischen ihnen anwendet.

Unter Qt Quick Behaviors with States wird ein häufiges Problem bei der Verwendung von Behaviors zur Animation von Zustandsänderungen erläutert.

Schnelles Vorspulen von Zuständen

Damit Transition Zustandsänderungen korrekt animieren kann, ist es manchmal notwendig, dass die Engine einen Zustand vor- und zurückspult (d. h. den Zustand intern setzt und aufhebt), bevor er schließlich angewendet wird. Der Prozess läuft folgendermaßen ab:

1. Der Zustand wird vorgespult, um den vollständigen Satz von Endwerten zu ermitteln.
2. Der Zustand wird zurückgespult.
3. Der Zustand wird vollständig angewendet, mit Übergängen.

In einigen Fällen kann dies zu unbeabsichtigtem Verhalten führen. Zum Beispiel wird ein Zustand, der das Modell einer Ansicht oder die sourceComponent eines Loaders ändert, diese Eigenschaften mehrfach setzen (anwenden, zurückspulen und dann wieder anwenden), was relativ teuer sein kann.

Die schnelle Weiterleitung von Zuständen sollte als ein Implementierungsdetail betrachtet werden und kann sich in späteren Versionen ändern.