打开和关闭附加 window (QML)

Question

目前我有一个 window 开放方式如下：

property variant win
Button {
    id: testButton
    MouseArea {
        onClicked: {
            var component = Qt.createComponent("test.qml");
            win = component.createObject(testButton);
            win.show();
        }
    }
}

可以像这样创建一个 window 还是有更好的方法（来自 QML，而不是来自 C++）？
当我关闭这个额外的 window（只需单击 "x" 按钮）时，我想将它连接到另一个事件（例如，更改按钮的颜色） .怎么做到的？

谢谢。

Answer 1

让它更具声明性通常更好。如果您希望您的按钮只打开一个 window，Loader 的用法可能适合您。
我认为这就是您想要的，因为您将它存储在一个变量中，如果您多次单击该按钮，您将无法访问您的实例。如果您需要由同一个 Button 创建的更多 Windows，您可以使用 ListModel 和 Instantiator 来创建实例。

对于 Loader 这可能看起来像这样：

Button {
    id: ldbutton
    onClicked: winld.active = true
    Rectangle {
        id: ldindic
        anchors {
            left: parent.left
            top: parent.top
            bottom: parent.bottom
        }
        width: height
        color: winld.active ? 'green' : 'red'
    }

    Loader {
        id: winld
        active: false
        sourceComponent: Window {
            width: 100
            height: 100
            color: 'green'
            visible: true
            onClosing: winld.active = false
        }
    }
}

此代码中也已经是您第二个问题的答案：您正在寻找的信号称为 closing - 连接到它以执行任何必要的操作。

在 Loader 的情况下，有必要卸载 window，以便稍后再次加载，也许吧。如果你有一个Instantiator创建的window，你需要从Instantiator的ListModel.

中删除相应的索引

这可能看起来像这样：

Button {
    id: rpbutton
    onClicked: rpmodel.append({})
    text: 'Open Windows ' + rpmodel.count

    ListModel {
        id: rpmodel
    }

    Instantiator { // from QtQml 2.0
        model: rpmodel
        delegate: Window {
            width: 100
            height: 100
            color: 'blue'
            visible: true
            onClosing: rpmodel.remove(index)
        }
    }
}

在您的代码中，您可以连接到它，方法是使用连接到您的属性 win 的 Connection 对象，或者通过更改 JS onClicked 像这样：

onClicked: {
    var component = Qt.createComponent("test.qml");
    win = component.createObject(testButton);
    win.closing.connect(function() { console.log('do something') })
    win.show();
}

打开和关闭附加 window (QML)

Open and close additional window (QML)

qt

qml

qtquick2

qtquickcontrols2