How do load QML Components when needed?
-
Hi guys,
i am working on an embedded Linux device driven by an RPI CM1.
My problem is that it takes over 10 secs to load my application.qml to my QQmlApplicationEngine.I have all my Items in their own *.qml files in qml/ui directory.
e.g. :
-LoginPage.qml
-InfoPage.qml
-ServiceMenu.qml
....So when i remove all components out of application.qml and only load the LoginPage.qml which is the first and only i need at startup , the engine only need 600ms to load the gui.
So my question is, is there a possibility to load all the other components later?
Actually my gui is controlled by states which are setting the visibility of the components.
I thought that QML only loads visible Items, but it doesn´t seem so.this is how my application.qml is working basicly:
ApplicationWindow { id: window width: 800 height: 480 color: Style.backgroundColor Item { id: state state: "LOGIN" states: [ State { name: "LOGIN" PropertyChanges { target: menu; visible: false} PropertyChanges { target: cluster; visible: false} PropertyChanges { target: infoPage; visible: false} PropertyChanges { target: icons; visible: false} PropertyChanges { target: rfidLogo; visible: true } PropertyChanges { target: hornIcon; visible: false } }, State { name: "DRIVE" PropertyChanges { target: menu; visible: true} PropertyChanges { target: cluster; visible: true} PropertyChanges { target: icons; visible: true} PropertyChanges { target: rfidLogo; visible:false } PropertyChanges { target: hornIcon; visible: true } PropertyChanges { target: infoPage; visible: false} } ] } Item { anchors.fill: parent InfoPage{ id: infoPage anchors.left: parent.left anchors.top: parent.top height: parent.height width: 300 errorCode: ie.hexError errorCode1: errorLogMessage voltage: io.batteryVoltage ontime: io.onHours optime: io.operatingHours lowcell: io.batteryLowestCell batttemp: io.batteryTemp motortemp: io.motorTemp celldiff: io.batteryDiff cutback: io.voltageCutback current: io.batteryCurrent brakerelease: io.brakerelease }
So is there a possibility to load for example this InfoPage after changing state from LOGIN to DRIVE?
Would be really nice if someone has a few advices for me, how to get this thing faster from StartUp.
Thanks,
Logi -
Hi guys,
i am working on an embedded Linux device driven by an RPI CM1.
My problem is that it takes over 10 secs to load my application.qml to my QQmlApplicationEngine.I have all my Items in their own *.qml files in qml/ui directory.
e.g. :
-LoginPage.qml
-InfoPage.qml
-ServiceMenu.qml
....So when i remove all components out of application.qml and only load the LoginPage.qml which is the first and only i need at startup , the engine only need 600ms to load the gui.
So my question is, is there a possibility to load all the other components later?
Actually my gui is controlled by states which are setting the visibility of the components.
I thought that QML only loads visible Items, but it doesn´t seem so.this is how my application.qml is working basicly:
ApplicationWindow { id: window width: 800 height: 480 color: Style.backgroundColor Item { id: state state: "LOGIN" states: [ State { name: "LOGIN" PropertyChanges { target: menu; visible: false} PropertyChanges { target: cluster; visible: false} PropertyChanges { target: infoPage; visible: false} PropertyChanges { target: icons; visible: false} PropertyChanges { target: rfidLogo; visible: true } PropertyChanges { target: hornIcon; visible: false } }, State { name: "DRIVE" PropertyChanges { target: menu; visible: true} PropertyChanges { target: cluster; visible: true} PropertyChanges { target: icons; visible: true} PropertyChanges { target: rfidLogo; visible:false } PropertyChanges { target: hornIcon; visible: true } PropertyChanges { target: infoPage; visible: false} } ] } Item { anchors.fill: parent InfoPage{ id: infoPage anchors.left: parent.left anchors.top: parent.top height: parent.height width: 300 errorCode: ie.hexError errorCode1: errorLogMessage voltage: io.batteryVoltage ontime: io.onHours optime: io.operatingHours lowcell: io.batteryLowestCell batttemp: io.batteryTemp motortemp: io.motorTemp celldiff: io.batteryDiff cutback: io.voltageCutback current: io.batteryCurrent brakerelease: io.brakerelease }
So is there a possibility to load for example this InfoPage after changing state from LOGIN to DRIVE?
Would be really nice if someone has a few advices for me, how to get this thing faster from StartUp.
Thanks,
Logi@LogiSch17 The Loader type is just for that, just read the docs.
-
OK,
I think i figuered it out now is this a correct way to do that?application.qml
Item{ id: infoPage anchors.left: parent.left anchors.top: parent.top height: parent.height width: 300 Loader{ id: infoPageLoader source: "ui/components/InfoPage.qml" onLoaded: { item.visivle=true item.errorCode = ie.hexError ..... } }
And at my State I set the Loader to active instead of visible:
State { name: "INFO" PropertyChanges { target: infoPageLoader; active: true } ..... }
Is this how the Loader should be used?