需求一:點擊按鈕彈出菜單,并且自定義菜單彈出位置。
mouse.x
和 mouse.y
獲取的是相對于 MouseArea
(在這個例子中是 Button
)左上角的局部坐標。如果你想要在鼠標點擊位置顯示 Menu
,你需要將這個局部坐標轉換為相對于應用程序窗口或屏幕的全局坐標。
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15Window {width: 640height: 480visible: truetitle: qsTr("Demo Cloud Music Player")//從全局對象拿到的點是正確的MouseArea{anchors.fill: parenthoverEnabled: trueonClicked: {console.log("mouse = ",mouseX,mouseY,mouse )myMenu.popup(mouseX,mouseY)}}// 創建一個菜單并添加菜單項Menu {id: myMenuMenuItem {text: "Option 1"onTriggered: console.log("Option 1 selected")}MenuItem {text: "Option 2"onTriggered: console.log("Option 2 selected")}MenuItem {text: "Option 3"onTriggered: console.log("Option 3 selected")}}Button{id:myButtonwidth: 100height: 100x:100// 將菜單與按鈕關聯// menu: myMenubackground:Rectangle{width: 25height: 25color: "red"border.color: "blue"}//方式一:從MouseArea獲取到點的位置發現不正確MouseArea{anchors.fill: parenthoverEnabled: trueonClicked: {var globalPos = myButton.mapToGlobal(mouse.x, mouse.y)console.log("MouseArea = ",mouseX,mouseY)console.log("mouse對象 = ",mouse.x,mouse.y,mouse )console.log("globalPos對象 = ",globalPos.x,globalPos.y,globalPos )//方式二//mouse.x獲取到的值是對于當前控件來說,需要加上偏移量myMenu.popup(mouse.x+myButton.x, mouse.y)console.log("myMenu對象 = ",myMenu.x,myMenu.y,myMenu )}}//正確方式一:// onClicked: {// console.log("clicked")// // 獲取按鈕的全局坐標這俄格應該是獲取到的是控件坐標// // var globalPos = myButton.mapToItem(null, 0, myButton.height)// // 在按鈕下方顯示菜單,先讓他顯示出來獲取到坐標在顯示一遍進行實現// myMenu.popup() // 默認就會在鼠標的當前位置打開。。。// console.log("x = ",myMenu.x,"y = " ,myMenu.y)// var x = myMenu.x +10// var y = myMenu.y +10// myMenu.popup(x,y)// }Keys.onLeftPressed: {console.log("left")}Keys.onRightPressed:{console.log("right")}}}