QML：デザインパーセプションからのqmlページ間の移動

Question

約100個のスクリーンがあるQtQuickプロジェクトを開発する必要があります。

私は、ボタンクリックで3つの画面を持つナビゲーションのデモプロジェクトを作成しようとしました。私はページ間のナビゲーションに「States」という概念を使用していました。最初は「Loader」を使用して同じ操作を試みましたが、ローダーは以前のページの状態を保持できませんでした。ナビゲーション中にページ全体が再ロードされていました。

以下は100の画面用状態を定義するために、その実現可能ではない。これは、3つのスクリーンを有する小さなPOCとうまく実行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; } 
     } 

    ] 

} 

のコードスニペットであるが。

設計面から、私たちはC++コントローラを作るために、さまざまなページの状態、可視性を制御します。

C++で 'State'ロジックを実装する方法を提案する必要があります。

Answer 1

QtクイックコンポーネントからStackViewを使用することをお勧めします。 Hereはそのドキュメントです。

Answer 2

設定可能なページリスト（モデルのようなもの）+スタートアップ時にすべてをロードしない（遅延インスタンス化）リピーター+ローダアイテムを非表示にして破棄しない我々がそれに戻ってくるならそれをリロードする必要があります）：

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; 
       } 
      } 
     } 
    } 
} 

希望します！