[Solved] Launch a child QML window from a parent QML window
-
I am using Qt 5.1 and the Qt Quick Controls provided with it inorder to implement the user interface.
I want to launch a (child) window when user clicks on a button. The part where I am confused is how I do it.Here is my code:
@
import QtQuick 2.1
import QtWebKit 3.0
import QtQuick.Controls 1.0
import QtQuick.Layouts 1.0ApplicationWindow {
title: "Facebook Authorizer"
width: 300
height: 300ColumnLayout { id: mainLayout anchors.fill: parent Button { id: authorizationLauncher text: "Authorize Facebook Account" Layout.fillWidth: true onClicked: { var component = Qt.createComponent("authorization-browser.qml"); var browserWindow = component.createObject(this); } } }
}
@As shown above, I tried to use Qt.createComponent to load a qml file, and launch a window by creating its instance. It didn't work. I tried to follow this "link.":http://qt-project.org/doc/qt-4.8/qdeclarativedynamicobjects.html
The article pointed by the link also states that "Objects can also be created and managed from C++, and this is the preferred method for hybrid QML/C++ applications.". My application, indeed, will contain a hybrid code. So, I thought this could be a better way. I did some reading on how to implement this, however, sadly failed to understand the implementation.
Could anyone try and explain the process using this example - When user presses a button in the main QML window, another QML windows should launch.
Some abstract explanation and links to articles that demonstrate this using Qt5+ would be welcome, too. -
Hi Bhoot,
you can try this,
AuthorizationBrowser.qml
@
import QtQuick 2.0
import QtQuick.Window 2.1 // needed for the Window componentWindow {
width: 300 height: 200 Rectangle { anchors.fill: parent color: "lightGrey" Text { anchors.centerIn: parent text: "My New Window" } }
}
@main.qml
@
import QtQuick 2.0Rectangle {
id: rootwidth: 360 height: 360 property variant win; // you can hold this as a reference.. Text { text: "Click here to open new window!" anchors.centerIn: parent } MouseArea { anchors.fill: parent onClicked: { var component = Qt.createComponent("AuthorizationBrowser.qml"); win = component.createObject(root); win.show(); } }
}
@ -
Thanks, it worked! I was inane enough to use "this" instead of the id of ApplicationWindow.
I am curious though, as to how this could be implemented in QML + C++. Please guide me if you know that.
Also, I want a value (access token, to be specific) back from the child window. How do you suggest I do that? My thought was to add a property to the child window: access_token, which I might access in the parent window before closing the child window.
Do you have a better suggestion?
[quote author="stevenceuppens" date="1375278713"]Hi Bhoot,
you can try this,
AuthorizationBrowser.qml
@
import QtQuick 2.0
import QtQuick.Window 2.1 // needed for the Window componentWindow {
width: 300 height: 200 Rectangle { anchors.fill: parent color: "lightGrey" Text { anchors.centerIn: parent text: "My New Window" } }
}
@main.qml
@
import QtQuick 2.0Rectangle {
id: rootwidth: 360 height: 360 property variant win; // you can hold this as a reference.. Text { text: "Click here to open new window!" anchors.centerIn: parent } MouseArea { anchors.fill: parent onClicked: { var component = Qt.createComponent("AuthorizationBrowser.qml"); win = component.createObject(root); win.show(); } }
}
@[/quote]