GroupBox 内部边距

Question

我将 label 和 label2 的边距相对于内部 groupBox2 设置为零。从图中可以看出，label是沿着groupBox2的边界，而label2则是多了一些边距。

GroupBox的内边距是多少？

GroupBox {
    id: groupBox1
    x: 5
    y: 302
    width: 142
    height: 90
    checked: false
    flat: false
    title: qsTr("Group Box")

    Label {
        id: label
        text: qsTr("Label")
        anchors.top: parent.top
        anchors.topMargin: 0
        anchors.left: groupBox2.left
        anchors.leftMargin: 0
    }

    GroupBox {
        id: groupBox2
        y: 16
        height: 45
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.left: parent.left
        anchors.leftMargin: 0
        title: qsTr("Group Box2")

        Label {
            id: label2
            text: qsTr("Label2")
            anchors.left: parent.left
            anchors.leftMargin: 0
        }
    }
}

Answer 1

GroupBox 具有定义内部边距的样式，它们的大小取决于您的程序运行所在的平台。

在您的 qt 安装目录中查看 GroupBox 样式，例如/path_to_installation/Qt5.5.0/5.5/Src/qtquickcontrols/src/controls/Styles/Base/GroupBoxStyle.qml，各个平台的子目录下也有自定义样式：Desktop/GroupBoxStyle.qml、WinRT/PC/GroupBoxStyle.qml、iOS/GroupBoxStyle.qml等

这是来自 Base/GroupBoxStyle.qml 的部分：

/*! The margin from the content item to the groupbox. */
padding {
    top: (control.title.length > 0 || control.checkable ? TextSingleton.implicitHeight : 0) + 10
    left: 8
    right: 8
    bottom: 6
}

因此在您的情况下左边距可能设置为 8。

GroupBox 有未记录的属性 style 可用于设置自定义样式。 GroupBox.style 和 GroupBoxStyle.qml 被标记为内部版本，因此在更新 Qt 时要小心，它们可能会在未来的 Qt 版本中被更改而不会发出警告，并且使用它的代码可能会停止工作。

因此，要设置不同的边距大小，您可以将 GroupBoxStyle.qml 复制到您的项目并像这样使用它：

GroupBox {
    style: GroupBoxStyle {
        padding.left: 0 //your desired padding value
    }
}

GroupBox 内部边距

GroupBox internal margins

qt

qml

qtquick2