代码之家 › 专栏 › 技术社区 › rsht

Flickable内的MouseArea阻止其轻弹

qt-quick qt5 qml qt

rsht · 技术社区 · 10 年前

我正在使用MouseArea实现手势捕捉器(向左/向右滑动)。它应该在垂直flickableDirection的Flickable内部工作。此外,它还应将鼠标事件按视觉堆栈顺序传播到其下的其他元素。问题是带有 传播合成事件 设置为true将阻止之前任何父级的笔势 精确的一个 单击。第一次单击后,它工作正常。这是显示这一点的简化代码。

import QtQuick 2.4
import QtQuick.Window 2.2

Window {
    id: __root
    visible: true
    width: 460; height: 640

    Flickable {
        id: mainFlickable

        width: parent.width
        height: parent.height
        contentHeight: column.height
        flickableDirection: Flickable.VerticalFlick

        MouseArea {
            anchors.fill: parent
            propagateComposedEvents: true
            z: 1
        }

        Column {
            id: column

            width: parent.width

            Repeater {
                model: 5

                Rectangle {
                    width: __root.width
                    height: 200

                    color: "yellow"
                    border.width: 2

                    MouseArea {
                        anchors.fill: parent

                        onClicked: {
                            console.log("clicked")
                        }
                    }
                }
            } //repeater
        } //column
    } //flickable
} //window

我花了很长时间试图解决这个问题,如果有任何帮助,我将不胜感激。提前感谢!

2 回复 | 直到 10 年前

rsht 10 年前

我发现MouseArea中的以下信号处理程序是解决此问题的一种变通方法,并且不会破坏我的代码:

onReleased: {
    if (!propagateComposedEvents) {
        propagateComposedEvents = true
    }
}

propagateComposedEvents 应设置为 false 声明(或提交)。

感谢大家的努力!

NG_ 10 年前

我找不到解决方法。希望它能满足您的需求(至少在提供更好的解决方案之前)。

以下是您的更新代码:

import QtQuick 2.4
import QtQuick.Window 2.2

Window {
    id: __root
    visible: true
    width: 460; height: 640

    Flickable {
        id: mainFlickable

        width: parent.width
        height: parent.height
        contentHeight: column.height
        flickableDirection: Flickable.VerticalFlick

        onDragStarted: ma.enabled = false
        onDragEnded: ma.enabled = true

        MouseArea {
            id: ma
            anchors.fill: parent
            enabled: false
            propagateComposedEvents: true
            z: 100

            onClicked: {
                print("CLICKED ON UPPER")
                mouse.accepted = false
            }
        }

        Column {
            id: column

            width: parent.width

            Repeater {
                model: 5

                Rectangle {
                    width: __root.width
                    height: 200

                    color: "yellow"
                    border.width: 2

                    MouseArea {
                        anchors.fill: parent                  
                        onClicked: console.log("clicked on child") 
                    }
                }
            } //repeater
        } //column
    } //flickable
} //window