MouseArea 不将点击传递给 CheckBox

Question

看看这个 QML 片段：

import QtQuick 2.4
import QtQuick.Controls 2.4

Rectangle {
    
    color: "blue"
    width: 50
    height: 50
    
    CheckBox {
        MouseArea {
            anchors.fill: parent
            propagateComposedEvents: true
        }    
    }
}

我想在 CheckBox 上添加 MouseArea 以便我可以处理双击。然而，无论我如何以及做什么 CheckBox 停止工作（点击它不会显示选中标记）一旦有 MouseArea 在它上面。

这是怎么回事？

Answer 1

您可以通过编程方式切换 Qt Quick 2 CheckBox 和 AbstractButton.toggle()。此外，MouseArea propagateComposedEvents 属性仅适用于其他 MouseAreas，不适用于 Qt Quick Controls QML 类型 .

我不知道你的用例，所以我在下面添加了一些可能性。

信号connect()方法

通过 MouseArea 实现切换的最简单方法是通过将单击的 MouseArea 连接到单击的 CheckBox 来创建信号链。

Rectangle {
    anchors.centerIn: parent
    color: "blue"
    width: 50
    height: 50
    CheckBox {
        id: checkBox
        onClicked: toggle()
        MouseArea {
            id: mouseArea
            anchors.fill: parent
        }
        Component.onCompleted: mouseArea.clicked.connect(clicked)
    }
}

请注意，双击总是从单击开始。如果你想 使用 MouseArea 捕捉双击，你可以使用 Timer 来防止将点击传播到 CheckBox。

Rectangle {
    anchors.centerIn: parent
    color: "blue"
    width: 50
    height: 50
    CheckBox {
        id: checkBox
        MouseArea {
            id: mouseArea
            anchors.fill: parent
            onClicked: {
                if (timer.running) {
                    return
                }
                checkBox.toggle()
                timer.start()
            }
            Timer {
                id: timer
                interval: 250
                repeat: false
            }
        }
    }
}

如果你想支持 CheckBox 的按下可视化 and/or 如果你想使用比 CheckBox 大小更大的 MouseArea 你可以看看这个的问题 无法单击鼠标区域下方的按钮。

MouseArea 不将点击传递给 CheckBox

MouseArea does not pass click to CheckBox

qt

qml

qt-quick

qtquick2