在行布局中垂直对齐项目

Question

我正在使用 Rowlayout 使用 qml 创建一行按钮，但在对齐按钮时遇到问题。然后我想在垂直和水平方向居中对齐。

我尝试了如下操作：

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"
        }
    }
}

结果如下图所示：

如何使图像从中心向外对齐？

Answer 1

你的意思是这样的：

将 Layout.alignment: Qt.AlignRight | Qt.AlignVCenter 添加到 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"
        }
    }
}

在行布局中垂直对齐项目

align items vertically in rowlayout

qt

qml

qt-quick

qt5