Question

我无法弄清楚为什么我的ToolButton如此之小。 ToolBar是顶部的橙色矩形。以下代码：

Item{

    ToolBar{
        id: toolbar
        width: parent.width
        height: scaleDP(0.29)
        anchors.top: parent.top

        background: Rectangle{
            color: "orange"
        }

        RowLayout{
            anchors.fill: parent


            ToolButton {
                id: buttonBack
                height: parent.height
                width: parent.height
                Image {
                    id: imageBack
                    source: "qrc:/assets/images/left-filled-black-50.png"
                    anchors.fill: parent
                    anchors.margins: 4
                }


            }

显示我的ToolButton如此之小：

我可以更改图像的高度并使其更大，但然后在ToolButton外部。当我尝试调整ToolButton的高度时，没有任何反应

首饰

似乎问题出在RowLayout上。如果我将其更改为行或矩形，则图标会按预期调整大小。

Answer 1

RowLayout使用其子项的implicitHeight和implicitWidth，并忽略高度和宽度。对于一些简单的项目（例如Rectangle），设置它们的高度也会改变它们的implicitHeight，但对于像ToolButton这样的QuickControl却不是这样。

RowLayout{
    height: 20
    width: parent.width
    // WON'T WORK
    ToolButton {
        id: buttonBack1
        height: parent.height
        width: parent.height
    }
    // OK
    ToolButton {
        id: buttonBack2
        Layout.preferredHeight: parent.height
        Layout.preferredWidth: parent.height
    }
    // OK TOO
    ToolButton {
        id: buttonBack3
        implicitHeight: parent.height
        implicitWidth: parent.height
    }
}

如果您仍然需要RowLayout，则有两种选择：

设置implicitHeigt和implicitWidth或
使用布局附加的属性：Layout.preferredHeight＆amp; Layout.preferredWidth

QML ToolButton没有调整大小

1 个答案: