QML: Navigation zwischen Qml-Seiten von Design-Wahrnehmung

Question

Wir müssen ein QtQuick-Projekt entwickeln, wo wir etwa 100 Bildschirme haben.

Ich hatte versucht, ein Demo-Projekt für die Navigation, die drei Bildschirme auf Knopfdruck hat. Ich hatte die Begriffe "Staaten" in der Navigation zwischen den Seiten verwendet. Anfangs habe ich dasselbe mit 'Loader' versucht, aber Loader konnte den vorherigen Zustand der Seite nicht beibehalten, er hat die gesamte Seite während der Navigation neu geladen.

Unten ist der Code-Schnipsel main.qml

// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5 
import QtQuick 1.1 

Rectangle { 
    id:main_rectangle 
    width: 360 
    height: 640 

    Page1{ 
     id:page1 
    } 

    Page2{ 
     id:page2 
    } 

    Page3{ 
     id:page3 
    } 

    states: [ 
     State { 

      name: "page2" 

      PropertyChanges { target: page3; visible:false; } 
      PropertyChanges { target: page1; visible:false; } 
      PropertyChanges { target: page2; visible:true; } 
     }, 
     State { 
      name: "page1" 
      PropertyChanges { target: page3; visible:false; } 
      PropertyChanges { target: page2; visible:false; } 
      PropertyChanges { target: page1; visible:true; } 
     }, 

     State { 
      name: "page3" 
      PropertyChanges { target: page1; visible:false; } 
      PropertyChanges { target: page2; visible:false; } 
      PropertyChanges { target: page3; visible:true; } 
     } 

    ] 

} 

Das läuft gut mit dem kleinen POC mit drei Bildschirmen, aber es ist nicht möglich, Zustände zu 100 Bildschirmen zu definieren.

Aus dem Design-Aspekt schlossen wir, um einen C++ Controller zu machen, den wir die Zustände, die Sichtbarkeit verschiedener Seiten kontrollieren.

Benötigen Sie Vorschläge zur Implementierung der 'State' Logik in C++.

Answer 1

Ich schlage vor, StackView von Qt Quick Components zu verwenden. Here ist seine Dokumentation.

Answer 2

Hier ist die einfachste Lösung in einfachen QML, mit einer konfigurierbaren Seitenliste (wie ein Modell) + Repeater + Loader Elemente nicht alles beim Start laden (faule Instanciation) und nicht eine Seite nach dem Verbergen (nicht zu zerstören) muss es neu laden, wenn wir darauf zurückkommen):

import QtQuick 1.1 

Rectangle { 
    id: main_rectangle; 
    width: 360; 
    height: 640; 

    // Put the name of the QML files containing your pages (without the '.qml') 
    property variant pagesList : [ 
     "Page1", 
     "Page2", 
     "Page3", 
     "Page4", 
     "Page5" 
    ]; 

    // Set this property to another file name to change page 
    property string currentPage : "Page1"; 

    Repeater { 
     model: pagesList; 
     delegate: Loader { 
      active: false; 
      asynchronous: true; 
      anchors.fill: parent; 
      visible: (currentPage === modelData); 
      source: "%1.qml".arg(modelData) 
      onVisibleChanged:  { loadIfNotLoaded(); } 
      Component.onCompleted: { loadIfNotLoaded(); } 

      function loadIfNotLoaded() { 
       // to load the file at first show 
       if (visible && !active) { 
        active = true; 
       } 
      } 
     } 
    } 
} 

Hoffe es hilft!