QML не центрирует компонент

У меня есть простой компонент, который предназначен для отображения изображения с некоторым текстом под ним следующим образом:

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. Изображения напрямую связаны в компонентном источнике.

1 ответ

  1. Вы пытаетесь центрировать ваш RowLayoutв своем родителе, Rectangleкоторый не имеет свой widthнабор свойств.
    Установите ширину прямоугольника на некоторое значение или на его родительскую ширину, напримерwidth: parent.width, установив его якоря, как например:

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