Question

我有自己的委托ListView。

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ItemDelegate
{
    height: 40

    Row
    {
        spacing: 10
        anchors.verticalCenter: parent.verticalCenter

        CheckBox
        {

        }
    }
}

问题是尽管有ItemDelegate的高度，复选框也不会调整大小。

我得到的是身高= 40：

我得到的是身高= 10：

我尝试过使用CheckBox'的宽度和高度值 - 没有帮助。

是否可以将其缩小，而无需定制？

Answer 1

理论上，您可以增加指标的大小，但不会增加复选标记图像的大小：

CheckBox {
    text: "CheckBox"
    anchors.centerIn: parent
    checked: true

    indicator.width: 64
    indicator.height: 64
}

图像缩放的原因有两个。首先，如果重新标记，则复选标记将会模糊。更重要的是，要保持最佳性能。 Qt Quick Controls 2不是计算相对于彼此的所有尺寸，而是像Qt Quick Controls 1那样创建大量的绑定，而是将其可扩展性基于Qt 5.6中引入的自动高DPI缩放系统。使用比例因子N运行时，您只会得到一个不同的@Nx图像。

Answer 2

我担心您需要customize您的复选框才能获得不同的尺寸。

示例：

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQml 2.2

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Component {
        id: contactDelegate

        ItemDelegate
        {
            id: item
            width: 40
            height: 40

            CheckBox
            {
                id: control
                text: name

                indicator: Rectangle {
                    implicitWidth: item.width
                    implicitHeight: item.height
                    x: control.leftPadding
                    y: parent.height / 2 - height / 2
                    border.color: control.down ? "#dark" : "#grey"

                    Rectangle {
                        width: 25
                        height: 25
                        x: 7
                        y: 7
                        color: control.down ? "#dark" : "#grey"
                        visible: control.checked
                    }
                }
            }
        }
    }

    ListView {
        width: 180;
        height: 200;
        spacing: 10

        model: ContactModel {}
        delegate: contactDelegate
    }
}

顺便说一下，spacing属性应该在ListView中设置，而不是代理。否则，它没有效果。

QML：调整CheckBox的大小

2 个答案: