How to Prevent overlapping HoverHandler steals event?
Unsolved
QML and Qt Quick
-
I have two overlapping rectangles with HoverHandlers in them.
As soon as I hover over the top left corner of the Bottom Rectangle, the Top Rectangle's HoverHandler receives the event.
On the right side, you can see that they are using MouseAreas. I would like to achieve the same result with HoverHanlder.
Is there any way to achieve this behavior?
I tried setting
grabPermissions: PointerHandler.TakeOverForbidden
for the HoverHandler, but it didn't work.import QtQuick 2.15 import QtQuick.Window 2.15 import QtQuick.Shapes 1.15 Window { width: 760 height: 480 visible: true title: qsTr("HoverHandler Test") Rectangle { width: 150 height: 100 color: handler1.hovered ? "orange" : "grey" border.color: "black" x: 100 y: 200 Text { x: 10 y: 10 text: "HoverHandler" } HoverHandler { id: handler1 grabPermissions: PointerHandler.TakeOverForbidden cursorShape: Qt.SizeVerCursor } } Rectangle { width: 150 height: 100 color: handler2.hovered ? "red" : "grey" border.color: "black" x: 200 y: 250 HoverHandler { id: handler2 grabPermissions: PointerHandler.TakeOverForbidden cursorShape: Qt.SizeHorCursor } } Rectangle { width: 150 height: 100 color: mouseArea1.hovered ? "orange" : "grey" border.color: "black" x: 400 y: 200 Text { x: 10 y: 10 text: "MouseArea" } MouseArea { id: mouseArea1 anchors.fill: parent property alias hovered: mouseArea1.containsMouse hoverEnabled: true cursorShape: Qt.SizeVerCursor } } Rectangle { width: 150 height: 100 color: mouseArea2.hovered ? "red" : "grey" border.color: "black" x: 500 y: 250 MouseArea { id: mouseArea2 anchors.fill: parent property alias hovered: mouseArea2.containsMouse cursorShape: Qt.SizeHorCursor hoverEnabled: true } } }
-
See if changing this: https://doc.qt.io/qt-5/qml-qtquick-hoverhandler.html#acceptedButtons-prop to Qt.NoButton keeps it from stealing click events.