qt - 拉伸(stretch)元素以包含所有子元素

Question

QML 怎么可能？自动拉伸(stretch)元素以使其所有子元素都适合它？以及如何指定间距？例如，我想在文本周围有一个矩形。矩形应该有一些内部间距。

如果我写以下内容，则矩形的大小为 0,0。

Rectangle {
    color: "gray"
    anchors.centerIn: parent;

    Text {
        text: "Hello"
    }
}

如果我尝试使用 Column 修复它元素，如 How to make QML items to grow to fit contents? 中所建议的那样，然后我通过整个窗口/父级得到一列，

Column {
    anchors.centerIn: parent

    Rectangle {
        color: "gray"
        anchors.fill: parent
    }

    Text {
        anchors.centerIn: parent
        text: "Hello"
    }
}

编辑:

我也尝试过使用 Flow元素而不是 Column ，但后来我在整个窗口/父级中排了一行。

Answer 1

您可以使用 childrenRect 属性:

import QtQuick 2.0

Rectangle {
    width: 320
    height: 200

    Rectangle {
        color: "BurlyWood"
        anchors.centerIn: parent
        width: childrenRect.width + 20
        height: childrenRect.height + 20

        Text {
            id: hello
            x: 10
            y: 10
            text: "Hello"
        }

        Text {
            anchors.left: hello.right
            anchors.leftMargin: 10
            anchors.top: hello.top
            text: "World"
        }
    }
}

但是，请注意使用 childrenRect结合使用 anchors.centerIn: parent在其中一个直接子级中会产生有关绑定(bind)循环的警告。