Qml类型：MouseArea

MouseArea鼠标点击事件的透传

实现MouseArea的透传，让鼠标事件从父控件传递到子控件。

建立两个Rectangle，rect1和rect2，rect1是rect2的父控件，并且子控件的区域和父控件的区域一样，如下代码（显示为橙色的一个矩形区域，红色的父控件被橙色的子控件所覆盖）。如果在父控件中实现一个覆盖整个父控件的MouseArea的点击事件，那么默认的情况下，只有父控件接收到点击事件，而子控件不会接收到点击事件。

需要让子控件能接收到父控件的点击消息时，父控件的MouseArea需要做两个处理：

• 1、设置propagateComposedEvents为true，此属性表示组合的鼠标事件是否会自动传播到与此MouseArea重叠但视觉堆叠顺序较低的其他MouseArea。默认情况下，此属性为false。
• 2、在MouseArea的消息处理中设置MouseEvent::accepted为false，表示让当前的事件继续往下传递。

Rectangle {
	id: rect1
	width: 328
	height: 32
	color: "red"

	Rectangle {
		id: rect2
		anchors.fill: parent
		color: "orange"
		MouseArea {
			anchors.fill: parent
			onClicked: {
				console.log("rect2 clicked 22")
			}
		}
	}

	MouseArea {
		anchors.fill: parent
		propagateComposedEvents : true	// 1.
		onClicked: {
			console.log("rect1 clicked 333")
			mouse.accepted = false		// 2.
		}
	}
}

上述代码mouse.accepted = false中的mouse是哪来的？

这个mouse是onClicked槽函数对应的clicked信号携带的参数，clicked信号的声明是：clicked(MouseEvent mouse)。

如果想让MouseArea不接受鼠标事件可以设置acceptedButtons为Qt.NoButton。

---

咨询作者请使用微信公众号搜索：“上官宏竹”，或者扫下面的二维码，后台留言咨询。