2016-09-23 4 views
2

Ich bin ein C++ - Entwickler, jetzt studiert über GUI-Entwicklung mit QML in QtQuick.Wie GUI-Bildschirmübergang in Qml funktioniert

Bei der GUI-Erstellung ist nur ein Bildschirm für den Benutzer sichtbar. Und basierend auf Benutzerinteraktion werden die Bildschirme umgeschaltet. Aber was passiert eigentlich dahinter?

Es gibt viele Informationen nur, wie man einen einzelnen Bildschirm gestaltet, aber sehr wenig Ressource für die Verwaltung der Übergänge ihrer Zustände.

Sind alle Bildschirme und Komponenten geladen, wenn Sie die Anwendung starten und die Layer-Reihenfolge einmal Bildschirm anzuzeigen ändern,

ODER

nach einer Aktion des Benutzers, der neue Bildschirm eingebaut ist, geladen und alte zerstört (Nur ein Bildschirm ist gleichzeitig im Speicher)

Wie lautet die Bezeichnung für diese Art der Handhabung?

Es wäre so hilfreich zu zeigen, wo ich solche Informationen finden kann.

Wenn Sie meine Frage nicht verstehen, lassen Sie es mich bitte wissen. Ich werde es nochmal schreiben !!

Antwort

1

Es ist eine bequeme fertige Lösung zur Verfügung: StackView. Es bietet integrierte Übergänge für Seiten, die ein- und ausgeblendet werden.

StackView { 
    id: stack 
    initialItem: Page { 
     Button { 
      text: "Push" 
      anchors.centerIn: parent 
      onClicked: stack.push(Qt.resolvedUrl("OtherPage.qml")) 
     } 
    } 
} 

StackView können Sie push Artikel, URLs und Komponenten. Wenn Sie eines der beiden letztgenannten Elemente auswählen, erstellt und löscht StackView die Instanz automatisch. Wenn Sie beispielsweise mehrere URLs oder Komponenten verschieben, wird nur die oberste Komponente instanziiert, die zum aktuellen Element auf dem Stapel wird. Sobald Sie pop Elemente aus dem Stapel entfernen, erstellt es eine Instanz des Elements darunter auf Anforderung, sobald es das aktuelle oberste Element auf dem Stapel wird. StackView ermöglicht es Ihnen auch, ein oder mehrere Elemente im Stapel replace. Wenn Sie dynamisch erstellte Elemente aus dem Stapel löschen oder ersetzen, werden die Instanzen nach Abschluss der entsprechenden Übergänge automatisch gelöscht.

+0

Vielen Dank für die Erklärung. –

+0

Gibt es sowieso, um die Animation während des Bildschirmübergangs die 'Stackview' standardmäßig zu deaktivieren? –

+0

Ja, Sie können 'StackView.Immediate' als letztes Argument an push(), pop() oder replace() übergeben. – jpnurmi

2

Eine der möglichen Optionen zwischen verschiedenen Bildschirmen wechseln Staaten mit:

ColumnLayout { 
    id: controls 

    states: [ 
     State { 
      id: state1 
      name: "STATE1" 

      property list<Item> content: [ 
       Loader { 
        ... 
       }, 
       MyItem { 
        ... 
       } 
      ] 

      PropertyChanges { 
       target: controls 
       children: state1.content 
      } 
     }, 
     State { 
      id: state2 
      name: "STATE2" 

      property list<Item> content: [ 
       MyHud { 
        ... 
       } 
      ] 

      PropertyChanges { 
       target: controls 
       children: state2.content 
      } 
     } 
    ] 
} 
2

Sie Loader können verschiedene qml-Dateien oder QML-Komponenten zu laden.

Beispiel:

import QtQuick 2.0 
Item { 
    width: 200; height: 200 
    Loader { id: pageLoader } 
    MouseArea { 
     anchors.fill: parent 
     onClicked: pageLoader.source = "Page1.qml" 
    } 
}