如何使非模态对话框窗口始终位于顶部？

Question

我在我的应用程序中使用Dialog {} 的实例来显示一个小的控制器窗口，用户可以与之交互以影响主窗口中的功能（类似于遥控器）。我可以将此对话框设为模态（modality: Qt.WindowModal 或 modality: Qt.ApplicationModal），也可以使用modality: Qt.NonModal 将其设为非模态。

我的问题是我需要将其设为非模态但始终位于主窗口的顶部。如果我使用Qt.NonModal，我仍然可以单击主窗体，但我的对话框会在它后面。 Dialog 类似乎没有 flags: 属性，所以我不能只将其设置为 Qt.WindowsStaysOnTopHint。

有没有什么方法可以像这样纯粹从 QML 方面设置对话框的标志？或者是否可以在 C++ 中编写一个简单的实用程序方法，我可以从对话框的Component.onCompleted: 调用并传入对话框以在那里设置其窗口标志？

更新：为了说明我在说什么，这是我的主窗口顶部的对话框：

这是我的主窗口下方的对话框：

我希望我的对话框不会像这样进入我的主窗口下方，但我仍然希望能够单击并与我的主窗口进行交互。换句话说，我希望我的对话框是非模态的，但总是在顶部。

Answer 1

尝试使用Window 而不是Dialog 这样您就可以访问flags 属性。

您可以将flags 设置为Qt.WindowStaysOnTopHint 以使您的窗口始终位于其他窗口之上。您可以找到标志列表here。 （不要忘记在 QML 中将 :: 替换为 .）

Main.qml：

import QtQuick 2.5
import QtQuick.Controls 2.0
import QtQuick.Dialogs 1.2

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")


    Button {
        id: btn
        width: 100 ; height : 40
        text: "click me"
    }

    Text {
        anchors.top : btn.bottom
        text: "Button currently pressed"
        visible: btn.pressed
    }

    DialogOnTop {

    }
}

DialogOnTop.qml：

import QtQuick 2.0
import QtQuick.Window 2.0
import QtQuick.Controls 1.4

Window {
    id: myWindow

    width: 200
    height: 200

    flags:  Qt.Window | Qt.WindowSystemMenuHint
            | Qt.WindowTitleHint | Qt.WindowMinimizeButtonHint
            | Qt.WindowMaximizeButtonHint | Qt.WindowStaysOnTopHint


    visible: true
    modality: Qt.NonModal // no need for this as it is the default value


    Rectangle {
        color: "lightskyblue"
        anchors.fill: parent
        Text {
            text: "Hello !"
            color: "navy"
            anchors.centerIn: parent
        }
    }
}

结果：

Answer 2

通常你想使用Dialog 不仅仅是为了创建一个新窗口，而是为了它实现的功能和界面......

Dialog不继承Window或ApplicationWindow的原因很明显：没有窗口，只要不是open()。但是一旦打开，就会有一个ApplicationWindow（来自QtQuick.Controls 1.4）

现在，在文档中，我们发现了这个漂亮的附加属性：ApplicationWindow，每个Item 都可以使用它，并且方便我们访问窗口。然后我们只需要找到一种方法来设置正确的标志，只要ApplicationWindow 可用 - 例如当我们收到信号visibleChanged.
由于Dialog 也不是Item，我们需要使用它的contentItem 来访问这个附加属性。

当我们将所有这些放在一起时，结果可能如下所示：

NonModalDialogThatStaysOnTop.qml // 我不擅长命名

import QtQuick 2.3
import QtQuick.Controls 1.4 // You need this, to have access to the `ApplicationWindow`-attatched property
import QtQuick.Dialogs 1.2

Dialog {
    onVisibleChanged: {
        if (visible) contentItem.ApplicationWindow.window.flags |= Qt.WindowStaysOnTopHint
    }
    modality: "NonModal"
}

现在你有你最喜欢的Dialog，它保持在顶部但不是模态的。

Answer 3

好的，所以您只想创建一个对话框（或一个看起来像对话框的组件）并且只想与主窗口和对话框窗口进行交互。

请尝试以下方法：

main.qml

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
    id: rootWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    color: "green"

    Rectangle {
        id: behind
        anchors.fill: parent
        color: Qt.rgba(0, 0, 0,  0.7)
        visible: false
    }

    MouseArea {
        enabled: behind.visible
        anchors.fill: parent

        onClicked: {
            console.log("Root Window")
        }
    }

    Button {

        text: "Open Dialog"

        onClicked: {
            behind.visible = true;
            var comp = Qt.createComponent("qrc:/MyDialog.qml");
            // var comp = Qt.createComponent("qrc:/DialogQt.qml");
            var obj1 = comp.createObject(rootWindow, {});
            obj1.z = 2;
        }
    }
}

MyDialog.qml

import QtQuick 2.7

Rectangle {
    id: modalWindow
    width: 200
    height: 200
    color: "red"

    anchors.centerIn: parent

    MouseArea {
        anchors.fill: parent
        onClicked: {
            console.log("Modal Window")
        }
    }
}

单击“打开对话框”按钮将在主窗口组件顶部创建并打开“模式”对话框。

当然，您必须自行调整“MyDialog.qml”文件以适应您的设计要求。

但是，将其用作“真实”对话框（对我而言）也确实有效，就像 G.M 在 cmets 部分中已经指出的那样：

DialogQt.qml

Dialog {
    visible: true
    title: "Blue sky dialog"

    modality : Qt.ApplicationModal

    contentItem: Rectangle {
        color: "lightskyblue"
        anchors.fill: parent
        Text {
            text: "Hello blue sky!"
            color: "navy"
            anchors.centerIn: parent
        }
    }

}