如何在 qml 中关闭单个屏幕/页面？答案

【问题标题】：How to close a single screen/page in qml?如何在 qml 中关闭单个屏幕/页面？
【发布时间】：2014-12-18 17:02:04
【问题描述】：

有Qt.quit()退出应用程序，但我只想退出当前屏幕，这应该让我回到父屏幕。我该怎么做？

Rectangle {
    id: page
    visible: true
    width: 360
    height: 480

    Button {
        width: 150
        height: 50
        text: "Parent"

        onClicked: {
            console.log("Parent pressed")

            //? how to exit this screen here?
        }
    }
}

这是 Folibis 回答后的新代码。

import QtQuick 2.3
import QtQuick.Window 2.2

Window {
    visible: true
    width: 360
    height: 360

    property bool isClose: false

    MouseArea {
        anchors.fill: parent
        onClicked: {
            if(isClose)
                 Qt.quit();
             else
                 Page2.show() //subWindow.show();
             isClose = true;
        }
    }

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

窗口位于新的 qml 文件中，现在名为 Page2.qml

import QtQuick 2.0
import QtQuick.Window 2.2

Window {
    id: subWindow
    visible: false
    width: 400
    height: 400
    flags: Qt.Dialog
    Text {
        anchors.centerIn: parent
        text: "Click me to close the subwindow"
    }
    MouseArea {
        anchors.fill: parent
        onClicked: subWindow.close();
    }
}

问题是如何从 main.qml 调用 Page2.qml？

【问题讨论】：

也许只是page.visible = false ?
只有rectangle在同一个文件中才有效，我想从另一个qml文件返回。
查看 StackView：qt-project.org/doc/qt-5-snapshot/…

标签： qt qml

【解决方案1】：

我认为在应用程序中组织窗口的正确方法是使用适当的组件。 Rectangle 因为窗口没有用，也没有语义。将Window 用于对话框和辅助窗口，将ApplicationWindow 用作主窗口。作为奖励，您拥有管理它的所有有用功能。

例子：

ApplicationWindow {
    width: 800
    height: 600
    id: mainWindow
    property bool isClose: false
    Text {
        anchors.centerIn: parent
        text: isClose ? "Click me to close the main window" : "Click me to show subwindow"
    }
    MouseArea {
        anchors.fill: parent
        onClicked: {
            if(isClose)
                Qt.quit();
            else
                subWindow.show();
            isClose = true;
        }
    }
    Window {
        id: subWindow
        visible: false
        width: 400
        height: 400
        flags: Qt.Dialog
        Text {
            anchors.centerIn: parent
            text: "Click me to close the subwindow"
        }
        MouseArea {
            anchors.fill: parent
            onClicked: subWindow.close();
        }
    }
}

【讨论】：

我可以将 subWindow 移动到一个新的 qml 文件吗？我对Page2.qml 和上面的Page2.show() 这样做了，但它不起作用。
当然，您可以将窗口移动到您想要的任何位置。在创建和关闭窗口时显示代码，可能你错过了什么
但是 id 不起作用。我在另一个 page2.qml 文件中定义了Windowmodule。我该如何展示呢？
请出示对应的代码，否则很难说问题出在哪里
好的，我明白了问题所在。您必须了解对象声明和对象实例之间的区别。在您的情况下， Page2.qml 只是一个声明，此结构在内存中不存在。所以你需要实例化对象。请参阅下面的答案。

【解决方案2】：

实例化新窗口

var component = Qt.createComponent("Page2.qml");
if (component.status == Component.Ready) {
    var subWindow = component.createObject(mainWindow);
    conn.target = subWindow;
    subWindow.show();
}

Connections {
    id: conn
    onVisibleChanged: {
        if(visible)
            console.log("window closed");
    }
}

作为奖励 - 触发窗口关闭事件的代码

【讨论】：