[Qt-qml] Forwarding mouse events to MouseArea underneath

Gregory Schlomoff gregory.schlomoff at gmail.com
Fri Jan 7 10:51:01 CET 2011


Hello,

We are in a situation where we have one big MouseArea on top handling
click events and several smaller MouseAreas below handling
double-click events.

Unfortunately, there is currently no way in QML to say that an event
should "bubble" up or down to the next receiver. The top MouseArea
will always catch all events, and the MouseAreas below will get
nothing.

There is a very specific solution when the event you want to handle in
the topmost MouseArea is onDrag. In this case, you can use
drag.filterChildren: true to let the topmost MouseArea catch only drag
event and pass other events to MouseAreas beneath. But it won't work
for other events.

We devised a ugly hack to work around this, that basically involves
catching the event in the topmost MouseArea and manually calling the
event handler on any MouseArea underneath:

===============
import QtQuick 1.0

Rectangle {
	width: 360
	height: 360

	MouseArea {
		anchors {fill: parent; margins: 40}
		onClicked: console.log("hello from below");
	}

	MouseArea {
		id: mouseArea
		anchors.fill: parent

		onClicked: {
			console.log("hello from top")
			forwardEvent(mouse, "clicked");
		}

		function forwardEvent(event, eventType) {
			mouseArea.visible = false
			var item = parent.childAt(event.x, event.y)
			mouseArea.visible = true
			if (item && item != mouseArea && typeof(item[eventType]) == "function") {
				item[eventType](event);
			}
		}
	}
}
===============

What do you think? Are there any better solutions? Should this be a
built-in functionnality in QML so that we can avoid this hack,
especially the fact that we have to hide / show the element to get
elements below. Any feedback is appreciated.

Thanks,

Greg


More information about the Qt-qml mailing list