QML değişiklik görünümüne tıklayın

Question

Ekibimle bir proje üzerinde çalışıyorum. İşim, Gömülü Sistem için QML ve C++ içeren bir Gui oluşturmaktır.

Her biri için qml dosyasını görüntüle.

Ama şimdi bunların arasında gezinmek istiyorum. Bu, bir Düğmeye tıklarken görünümün değişmesi gerektiği anlamına gelir. Her Görünümün bir geri düğmesi vardır, bu yüzden Ana Görünümüm'e geri dönebilirim.

Bu, qml'de mümkündür? i

Answer 1

++ c ile çözmek zorunda Değilse Sen QDeclarativeView gelen C++ ve kullanım türetmek bir sınıf oluşturabilirsiniz:

void setSource (const QUrl & url) 

anda görüntülenen QML dosyasını değiştirmek için. Düğmeye tıklandığında bu yöntemi birden çok kez çağırabilirsiniz.

Sadece QML kullanan bir çözüm de var.

import QtQuick 1.0 
Item { 
    width: 200; height: 200 

    Loader { id: pageLoader } 

    MouseArea { 
    anchors.fill: parent 
    onClicked: pageLoader.source = "Page1.qml" 
    } 
} 

Answer 2

Başka bir seçenek de bu QML görüşlerini örneğini nerede bir ana QML sahip olmaktır ve durumlarını kullanarak aralarında değiştirin: Yükleyici elemanı bir göz atın.

Main { 
    View1{id:viewid1} 
    View2{id:viewid2} 
    View3{id:viewid3} 
    states: [ 
    State { 
     name: "" 
    }, 
    State { 
     name: "view1" 
     PropertyChanges {target: viewid1; state: "focused"} 
    }, 
    State { 
     name: "view2" 
     PropertyChanges {target: viewid2; state: "focused"} 
    ... 
    } 
    ] 
} 

bu seçeneği ve zaten sunulan bir arasında fark bu bir kalıcı olmasıdır, ve diğer masraflar QML (ayrıştırma ve örnekleme anlamına gelir ...) her seferinde.

Answer 3

biri Cevabınız için

import QtQuick 2.1 
import QtQuick.Controls 1.1 
import QtQuick.Window 2.1 

ApplicationWindow { 
    title: qsTr("My super app") 
    width: 640 
    height: 480 

    Button { 
     id: settingsButton 
     x: 370 
     y: 0 
     text: qsTr("Settings") 
     /* just change `visible` property by click */ 
     onClicked: { 
      statusView.visible  = false 
      settingsView.visible = true 
     } 
    } 

    Button { 
     id: statusButton 
     x: 171 
     y: 0 
     text: "Status" 
     /* toggle */ 
     onClicked: { 
      statusView.visible  = true 
      settingsView.visible = false 
     } 
    } 

    Item { 
     /* use id for access */ 
     id: statusView 
     x: 0 
     y: 50 
     width: 640 
     height: 430 
     /* visible: true */ 

     Text { 
      anchors.centerIn: parent 
      text: "status" 
     } 
    } 

    Item { 
     id: settingsView 
     x: 0 
     y: 50 
     width: 640 
     height: 430 
     /* invisible */ 
     visible: false 

     Text { 
      anchors.centerIn: parent 
      text: "settings" 
     } 
    } 
}