qt - Qt Design Studio 中 QML 的编辑器视图不正确

Question

这是 Qt Design Studio，不是 Qt Quick Designer，但可能是一样的。

我做了一个组件，

PaneWithTitle.qml

Column {
    id: column
    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
    spacing: Style.paneTitleOffset

    property string title
    property alias inside: inner_space.sourceComponent

    DefaultText {
        text: qsTr(title)
    }

    Pane {
        id: pane

        background: Rectangle {
            color: "#283547"
            radius: Style.rectangleCornerRadius
        }

        Loader {
            id: inner_space
        }
    }
}

我正在像这样使用它：

PaneWithTitle {
    title: "Recovery"
    inside: ColumnLayout {
        id: rows

        TextFieldWithTitle {
            id: seed_input
            title: qsTr("Seed")
        }

        TextFieldWithTitle {
            id: password_input
            title: qsTr("Password")
        }

        RowLayout {
            id: columns

            Button {
                id: back_button
                text: qsTr("Back")
            }

            Button {
                id: confirm_button
                text: qsTr("Confirm")
            }
        }
    }
}

当我运行它时，它在实时预览中看起来不错。但在编辑器中，窗格背景的大小为 0。

有没有一个优雅的解决方案？

Answer 1

很难找到一个绝对的解决方案，看起来表单编辑器项目层次结构中有一个错误，但您至少可以稍微改进它的显示方式。如果可以，请将您的问题作为 QDS错误报告提交。

您可以删除Loader、替换Loader.sourceComponent为pane.contentItem和包装PaneWithTitle.qml内容Item。代码将如下所示：

Item {
    id: root
    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

    property string title
    property alias inside: pane.contentItem

    Column {
        id: column
        anchors.fill: parent
        spacing: Style.paneTitleOffset

        Text {
            text: qsTr(title)
        }

        Pane {
            id: pane

            background: Rectangle {
                color: "#283547"
                radius: Style.rectangleCornerRadius
            }
        }
    }
}