qml布局定位+坐标系转化

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Title")

    // 手动定位 场景坐标是0，0 x轴向右增加 y轴向下增加 z控制上下层
    Rectangle {
        id: rect1
        x: 100
        y: 100
        width: 200
        height: 200
        color: "blue"
        Rectangle {
            id: rect2
            x: 10
            width: 50
            height: 50
            color: "red"
            Text {
                text: "rect2"
            }
        }
        Text {
            y: 100
            text: "rect1"
        }
    }

    Rectangle {
        width: 200
        height: 200
        z: -1
        color: "green"
    }

    Text {
        id: txt
    }

    MouseArea {
        anchors.fill: parent
        onClicked: (mouse)=>{
           txt.text = mouse.x + " : " + mouse.y
               
            // 项目坐标系-》item坐标系
            var pos = mapToItem(rect1, mouse.x, mouse.y)
            rect2.x = pos.x
            rect2.y = pos.y
            txt.text += "\n" + pos.x + " : " + pos.y

            // item坐标系-》项目坐标系
           var pos3 = mapToItem(rect1, rect2.x, rect2.y)
           rect3.x = pos3.x + 50
           rect3.y = pos3.y
//           txt.text += "\n" + pos.x + " : " + pos.y
        }
    }

    Rectangle {
        id: rect3
        width: 50
        height: 50
        color: "yellow"
    }
}