如何解决防止 MouseArea 在子矩形内捕捉点击
Map {
id: map
anchors.fill: parent
plugin: osm
zoomLevel: 16
minimumZoomLevel: 13
maximumZoomLevel: 20
gesture.enabled: true
Rectangle {
id: infoPanel
// ...
Button {
// ...
}
}
MouseArea {
anchors.fill: parent
onpressed: {
infoPanel.visible = false
}
}
infoPanel
矩形有时会变得可见,在地图上覆盖一些信息,以及一个触发特定操作的按钮。
现在我已经将鼠标区域添加到地图中,以便在点击地图时隐藏信息面板,这很好用。
但是,当点击信息面板本身的矩形时,信息面板也会被关闭。
如何防止地图上的鼠标区域干扰 infoPanel
内的任何内容?
解决方法
你必须这样做:
-
您必须将信息面板的 z 值设置为 map.z + 1 并为信息面板定义鼠标区域以捕获鼠标事件。像下面的代码
Map { id: map anchors.fill: parent plugin: osm zoomLevel: 16 minimumZoomLevel: 13 maximumZoomLevel: 20 gesture.enabled: true Rectangle { id: infoPanel width: 100 height: 100 color: "red" z: map.z + 1 MouseArea { anchors.fill: parent onClicked: { print("info panel") } } Button { width: parent.width / 2 height: width anchors.centerIn: parent text: "button" onClicked: { print("button") } } } MouseArea { anchors.fill: parent onPressed: { infoPanel.visible = false print("map") } }
}
-
或者只是将鼠标区域移到信息面板的上方
Map { id: map anchors.fill: parent plugin: osm zoomLevel: 16 minimumZoomLevel: 13 maximumZoomLevel: 20 gesture.enabled: true MouseArea { anchors.fill: parent onPressed: { infoPanel.visible = false print("map") } } Rectangle { id: infoPanel width: 100 height: 100 color: "red" MouseArea { anchors.fill: parent onClicked: { print("info panel") } } Button { width: parent.width / 2 height: width anchors.centerIn: parent text: "button" onClicked: { print("button") } } }
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。