Qt component: messages between pages
-
Hello everyone!
I'm struggling with a strange problem with pages.Lets imaging we have two pages:
@ApplicationWindow {
id: appWindowPage {
property string exampe;id: first ... Text { text: first.example } Button { onClicked: { pageStack.push(Qt.resolvedUrl("Second.qml")); } }
}
Component.onCompleted : { pageStack.push(Qt.resolvedUrl ("First.qml")); }
}@and
@Page {
id:second...
Button {
pageStack.pop(first, message: {first.example = "Hello"});
}}@
When I use only this two page everything is ok: message is sent to first page and is showed.
But lets imaging we add third page.@ApplicationWindow {
id: appWindowPage {
id:zero ... Text { text: "Zero page" } Button { onClicked: { pageStack.push(Qt.resolvedUrl("First.qml")); } }
}
Component.onCompleted : { pageStack.push(Qt.resolvedUrl ("Zero.qml")); }
}@and
@Page {
id:first...
Page {
property string example;id:first ... Text { text: first.example } Button { onClicked: { pageStack.push(Qt.resolvedUrl("Second.qml")); } }
}@
@Page {
id: second...
Button {
pageStack.pop(first, message: {first.example = "Hello"});
}}@
And after that I receive the message on runtime: reference error: variable first doesn't exist.
Do someone have any clue what's wrong with it?
Is it bug or I'm not correcly use the components? -
Hi, is it possible that you wrote
@
id=first
@
while you will write
@
id: first
@
instead? In QML properties should be assigne with the colon, not with equal sign (usedi n js) -
ivanovaos, I am not sure that the Qt.resolvedUrl() will be the best way to load the page. I checked the documentation and in theory it is but to be sure having all the returning signals under the control of your application I suggest the following function for page loading:
@
// Open a page and push it in the stack
function loadPage(file, param) {
// Create the Qt component based on the file/qml page to load.
var component = Qt.createComponent(file)
// If the page is ready to be managed it is pushed onto the stack
if (component.status == Component.Ready) {
// Decide it the page needs to be pushed with parameters if the
// param is empty or not.
if (param != "")
pageStack.push(component, {parameter: param});
else
pageStack.push(component);
}
else
console.log("Error loading: " + component.errorString());
}
@
Then I think that your page retrieval from stack works only in the first case because the first page is defined in the ApplicationWindow object. The elements instantiated in this object (that is the topmost of the three of your applpication) are visible to the child pages so you can pop the page using the id directly.
For the other pages this is not valid because the id as it is treated by you - as I know - is not persistant.In most cases you can simply call the pop stack without any parameters, this works as the "back" button in the navigation browser.
Anyway, if you need absolutely pop a specific page I see in the documentation the following:
bq. When you use pop() with no arguments, it pops the top page off the stack and returns that page to the caller. [...] If the page popped off the stack is based on the Item element, the page is re-parented back to its original parent.
If you give a page argument, the stack is unwound to the given page. Any Item-based pages popped off the stack are re-parented to their original parent.
However, if you specifically want to unwind the page stack to the first page in the stack, it is best to be explicit about what you are doing and use pop(null) rather than guessing a page that is not on the stack.In the documentation there is not so much of what should be this page argument where you have used the page assgined id. But seeing in the push documentation (referred for more info from the pop doc) it seems that the page argument is not a page ID but a page element at all so I suppose that it should be treated as an object. It will be one of the stack tasks to manage the page object as new if not yet loaded or retrieve it if the page is already present in the stack queue.