qt - QML：调整复选框大小

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

恐怕您需要自定义复选框以获得不同的大小。

例子：

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，而不是委托中。否则，它没有效果。