Question

我有一个简单的组件，用于显示带有一些文本的图像，如下所示：

Rectangle{
    id: functionView

    RowLayout {
        spacing: 350
        anchors.centerIn: parent

        Item {
            Image {
                id: upload_pic
                source: "http://icons.iconarchive.com/icons/custom-icon-design/mono-general-4/128/upload-icon.png"
                Text {
                    text: "Upload Images"
                    anchors.bottom: parent.bottom
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.bottomMargin: -20
                }
            }
            Layout.fillWidth: true
        }

        Item {
            Image {
                id: workflow_pic
                source: "http://icons.iconarchive.com/icons/icons8/windows-8/128/Data-Workflow-icon.png"
                Text {
                    text: "Upload Workflow"
                    anchors.bottom: parent.bottom
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.bottomMargin: -20
                }
            }
            Layout.fillWidth: true
        }


    }
}

但是，它在组件窗口上没有对齐（垂直或水平）。这可以使用qmlscene进行验证。图像直接链接在组件源中。

Answer 1

您试图将RowLayout置于其父级中心，这是一个Rectangle，其width属性集未设置。将矩形的宽度设置为某个值或其父宽度，例如width: parent.width或设置其锚点，例如：

anchors.left: parent.left
anchors.right: parent.right

QML不会使组件居中

1 个答案: