对话框标准按钮位置

Question

我只想用 1 个按钮（“确定”）制作对话框。但是当我使用“standardButtons：Dialog.Ok”时，它将它定位在右侧。它如何定位在中间？我想保留当前的按钮尺寸。

我尝试在页脚中使用 DialogBu​​ttonBox，以及 Rectangle 和 Buttons，但每次都不起作用，或者看起来一团糟

代码：

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15

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

    Button {
        id: button
        text: qsTr("Button")
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter
        onClicked: dialog.open()
    }

    Dialog {
        id: dialog
        modal: true
        font.bold: true
        title: "WARNING!!!"
        Text {
            id: dialogMessage
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, \nsed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
            horizontalAlignment: Text.AlignHCenter
        }
        parent: Overlay.overlay
        x: parent.width/2 - width/2
        y: parent.height/2 - height/2

        standardButtons: Dialog.Ok
    }
}

Answer 1

有几个选项：

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15

Window {
    id: window
    width: 640
    height: 480
    visible: true

    Dialog {
        id: dialog
        x: parent.width/2 - width/2
        y: parent.height/2 - height/2
        parent: Overlay.overlay
        modal: true
        font.bold: true
        title: "WARNING!!!"
        standardButtons: Dialog.Ok
        visible: true

        Text {
            id: dialogMessage
            text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, \nsed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
            horizontalAlignment: Text.AlignHCenter
        }

        // Declare your own DialogButtonBox.
        footer: DialogButtonBox {
            alignment: Qt.AlignHCenter
        }

        // Assign it declaratively.
//        Binding {
//            target: dialog.footer
//            property: "alignment"
//            value: Qt.AlignHCenter
//        }

        // Assign it imperatively.
//        Component.onCompleted: dialog.footer.alignment = Qt.AlignHCenter
    }
}

我已将其他方法注释掉，以说明您只需要其中一种方法。

请注意，您不能只做：

footer.alignment: Qt.AlignHCenter

因为footer 属性的类型是Item，而不是DialogButtonBox，并且Item 没有alignment 属性。

Answer 2

考虑使用Column Layout，它将保持对话框的形状。在DialogButtonBox 中同时使用Layout.alignment 和alignment 属性 - 对话框将如您所愿：

Dialog {
        id: dialog
        modal: true
        font.bold: true
        visible: true
        title: "WARNING!!!"
        ColumnLayout {
            Text {
                id: dialogMessage
                Layout.alignment: Qt.AlignHCenter
                text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, \nsed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
            }

            DialogButtonBox{
                standardButtons: DialogButtonBox.Ok
                Layout.alignment: Qt.AlignHCenter
                alignment: Qt.AlignHCenter

                onAccepted: dialog.close()
            }
        }
    }