有没有办法在 qml 的新窗口上创建表单？

Question

看问题How can I create a new window from within QML? 我们在那里看到我们可以通过这种方式创建一个新窗口：

main.qml

import QtQuick 2.3
import QtQuick.Controls 1.2

ApplicationWindow {
    id: root
    width: 200; height: 200

    Button {
        anchors.centerIn: parent
        text: qsTr("Click me")

        onClicked: {
            var component = Qt.createComponent("Child.qml")
            var window    = component.createObject(root)
            window.show()
        }
    }
}

Child.qml

import QtQuick 2.3
import QtQuick.Controls 1.2

ApplicationWindow {
    id: root
    width: 100; height: 100

    Text {
        anchors.centerIn: parent
        text: qsTr("Hello World.")
    }
}

但是这种方式似乎不可能将变量传递给 child.qml，然后在我们在这个新窗口上提交表单后，将它们放在 main.qml 上，或者有可能吗？我们该怎么做？

关于被转移到 Child.qml 的变量我想这样的事情会做：

                var b = tabButton.createObject(tabbar, {tabId: tabId, trCtx: tabs[t], tabTitle: c.title,
                                                        "font.pixelSize": 14, "font.bold": globals.menu.fontBold,
                                                        "font.family": robotoRegular.name})

如果这没问题，那么唯一缺少的就是从 Child.qml 获取值。

Answer 1

要初始化一个新对象，您可以使用初始化列表或在对象创建后分配新变量。使用初始化列表当然是最好的解决方案。如果你真的想传递“变量”（如列表或类似的东西），你的主窗口总是可以调用子窗口的函数。

两个窗口之间的通信可以通过使用信号和槽来实现。 您可以使用 JavaScript 或 QML 连接。在示例中，您将找到两种方式。您可以收听自己的信号或收听属性变化。

main.qml

//========================
//== Includes

import QtQuick 2.3
import QtQuick.Controls 1.2

//========================
//== Base Item

ApplicationWindow {

    //========================
    //== Properties

    property var childWindowHandle: null

    id: root
    width: 200;
    height: 200
    visible: true

    //========================
    //== Childs

    Button {

        //========================
        //== Properties

        anchors.centerIn: parent
        text: qsTr("Click me")

        //========================
        //== Functions

        function outputNewValue(){
            console.log(childWindowHandle.iWillChangeSoon)
        }

        //========================
        //== Connections

        onClicked: {
            var component = Qt.createComponent("Child.qml")

            // Using the "constructor" to initialize the object WHILE creating (no change signals emitted)
            root.childWindowHandle = component.createObject(root, { withConstructor: "\\(^_^)/" })

            // Check if creation was successfully
            if(root.childWindowHandle){

                // Change the value AFTER construction. The onAfterConstructorChanged signal get fired
                root.childWindowHandle.afterConstructor = "_(._.)_";

                // "Listen" on variable change. Every property has a corresponding change signal ("Changed" after name)
                root.childWindowHandle.iWillChangeSoonChanged.connect(outputNewValue)

                // Just show window...
                root.childWindowHandle.show()
            }
        }
    }

    Connections{ // <- You can also use "Connections" to listen for changes

        //========================
        //== Properties

        target: root.childWindowHandle ? root.childWindowHandle : null
        ignoreUnknownSignals: true // Important, because "childWindowHandle" can be "null"

        //========================
        //== Connections

        onSpecialSignal: console.log("An other signal fired!")
    }
}

Child.qml

//========================
//== Includes

import QtQuick 2.3
import QtQuick.Controls 1.2

//========================
//== Base Item

ApplicationWindow {

    //========================
    //== Properties

    property string withConstructor: ""
    property string afterConstructor: ""
    property string iWillChangeSoon: ""

    id: root
    width: 100;
    height: 100

    //========================
    //== Signals

    signal specialSignal()

    //========================
    //== Connections

    Component.onCompleted: {
        console.log("Child Component Completed")
        console.log("withConstructor:" + withConstructor)
        console.log("afterConstructor:" + afterConstructor)
    }

    //========================
    //== Childs

    Text {

        //========================
        //== Properties

        anchors.centerIn: parent
        text: qsTr("Hello World.")
    }

    Timer{

        //========================
        //== Properties

        running: true
        interval: 5000

        //========================
        //== Connections

        onTriggered:{

            // Change variable
            root.iWillChangeSoon = "Yep, I changed ;)"

            // Emit our special signal
            root.specialSignal();
        }
    }
}