QML自由拖拽区域中的图片

本博客的主要内容实现通过QML实现自由拖拽一个区域中的图片

一、实现思路
实现是通过QML中的MouseArea的属性来实现的。

二、实现代码

Rectangle {
        id: opacitytest;
        anchors.fill: parent
        Image {
            id: pic;
            source: "./1.png"
        }
        MouseArea {
            anchors.fill: pic
            drag.target: pic
            drag.axis: Drag.XAndYAxis//设置拖拽的方式
            drag.minimumX: 0
            drag.maximumX: opacitytest.width - pic.width
            drag.minimumY: 0
            drag.maximumY: opacitytest.height - pic.height
        }
    }

粘贴以上代码到你的文件中即可实现自由拖拽。
也可以到这里去[下载](https://download.youkuaiyun.com/download/qq_21078557/10471540)。