如果文本更改，如何使高度自动更改

Question

我想知道我的 text/label 修改文本后的高度。让我们以游戏中的对话系统为例。如果我有更多文本要显示，标签和背景的高度将需要扩展（自动）（反之亦然）。

目前它可以正确显示文本（如果我将裁剪设置为 false），但它不会改变标签的高度。因此，如果我在一列中放置 3 个标签，它们的文本可能会重叠。

在其他语言中，例如 delphi/pascal（使用 firemonkey），标签的大小具有属性“自动调整大小”，它会根据（的）的（长度）调整标签的高度内容。使用隐藏标签，可以简单地获取视觉标签的高度（并相应地更改伴随的背景）。

Qt/Qml有这个选项吗？

根据要求，我正在处理一个示例（来自 Bryan Cairns 的课程），其中第二个和第三个标签的文本重叠：

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

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

    Column {
        x: 0
        y: 0
        width: 538
        height: 340
        Label {
            id: label
            x: 60
            y: 38
            text: qsTr("This is a label")
        }

        Label {
            id: label1
            x: 60
            y: 74
            width: 107
            height: 75
            color: "#ff0000"
            text: qsTr("This is a long label title - probably the longest ever")
            wrapMode: Text.WordWrap
            font.pointSize: 13
            font.italic: true
            font.bold: true
            textFormat: Text.AutoText
            clip: false
        }

        Label {
            id: label2
            x: 60
            y: 208
            text: qsTr("This is <font color='blue'><b>H<i>T</i>ML</b>!!!</font>")
            font.pointSize: 40
        }
    }
}

Answer 1

就像 JarMan 建议的那样：从标签中删除高度属性就可以了。为了更好地回答我的问题，我更改了示例并使用隐藏标签和该标签的 onheightChanged 事件来修改 'something else' 的高度。在游戏对话中，它可以是文本的背景和对话本身的文本。在这个例子中，我只是根据我输入 labelHidden 的文本修改 label1 的（固定）高度。

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

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

    Label {
        id: labelHidden
        x: -600
        //y: 74
        width: 200
        //height: 75
        color: "#ff0000"
        text: qsTr("This is a long label title - probably the longest ever")
        wrapMode: Text.WordWrap
        font.pointSize: 13
        font.italic: true
        font.bold: true
        textFormat: Text.AutoText
        clip: false

        onHeightChanged: {
            label1.height = height
            label1.text = text
        }
    }

    Column {
        x: 0
        y: 0
        width: 538
        height: 340
        Label {
            id: label
            x: 60
            y: 38
            text: qsTr("This is a label")
        }

        Label {
            id: label1
            x: 60
            //y: 74
            width: 200
            height: 75
            color: "#ff0000"
            text: qsTr("This is a long label title - probably the longest ever")
            wrapMode: Text.WordWrap
            font.pointSize: 13
            font.italic: true
            font.bold: true
            textFormat: Text.AutoText
            clip: false
        }

        Label {
            id: label2
            x: 60
            y: 208
            text: qsTr("This is <font color='blue'><b>H<i>T</i>ML</b>!!!</font>")
            font.pointSize: 40
        }
    }

    Button {
        id: button
        x: 521
        y: 422
        text: qsTr("Make longer")
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 18

        Connections {
            target: button
            onClicked: {
                labelHidden.text = "This is an even longer text that alters the height of an invisible label and in its turn triggers the onHeightChange event of the invisible label to modify for instance a background height and a label height in a game dialog. For this example it only changes the height of label1."
            }
        }
    }
}

如果文本更改，如何使高度自动更改

how to make the height change automatically if the text changes

qt

qml

label

qtquick2

autosize