align items vertically in rowlayout

Question

I am creating a row of buttons with qml using a Rowlayout but am having trouble aligning the buttons. I would like to have then aligned centrally along both vertical and horizontal directions.

I tried something as follows:

RowLayout
{
    anchors.fill: parent
    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

    ToolButton {
        //anchors.verticalCenter: parent.verticalCenter
        //anchors.horizontalCenter: parent.horizontalCenter
        Image {
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            source: "../images/search.png"
        }
    }

    ToolButton {
        //anchors.verticalCenter: parent.verticalCenter
        //anchors.horizontalCenter: parent.horizontalCenter
        Image {
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            source: "../images/search.png"
        }
    }
}

This results in something as the following image:

How can I make the images get aligned from the center out?

Answer 1

You mean like this:

Add Layout.alignment: Qt.AlignRight | Qt.AlignVCenter to ToolButtons

RowLayout
{
    anchors.fill: parent
    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

    ToolButton {
        Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
        //anchors.verticalCenter: parent.verticalCenter
        //anchors.horizontalCenter: parent.horizontalCenter
        Image {
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            source: "search.png"
        }
    }

    ToolButton {
        Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
        //anchors.verticalCenter: parent.verticalCenter
        //anchors.horizontalCenter: parent.horizontalCenter
        Image {
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            source: "search.png"
        }
    }
}