Qt qml 图片根据鼠标位置进行放大缩小

import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 2.2
 
Window {
    visible: true
    width: 640
    height: 700
    title: qsTr("Hello World")
 
    Rectangle{
        id:rect;
        width: 500;
        height:400;
        clip:true;
        Image{
            id: img;
            x:( rect.width - width)/2;
            y: (rect.height - height)/2;
            width:{
                var ratio = rect.width/rect.height;
                var srcRatio = sourceSize.width/sourceSize.height;
                if( ratio > srcRatio )
                    return  height * srcra  ;
                else
                    return  rect.width;
            }
            height:{
                var ratio = rect.width/rect.height;
                var srcRatio = sourceSize.width/sourceSize.height;
                if(ratio > srcRatio)
                    return  rect.height;
                else
                    return  width / srcRatio;
            }
            source: "tvline.jpg"
 
        }
        MouseArea{
            anchors.fill: parent;
            drag.target:img;
            hoverEnabled: true;
            drag.axis:Drag.XAndYAxis;
            drag.minimumX: -img.width/2;
            drag.maximumX: img.width/2;
            drag.minimumY: - img.height/2;
            drag.maximumY: img.height/2;
            onWheel:{                       //滚轮;
                if(wheel.modifiers & Qt.ControlModifier )
                {
                    var datl = wheel.angleDelta.y/120;
                    if( datl > 0)
                    {
                        console.log("mouseX:"+mouseX+";mouseY:"+mouseY+";imgX:"+img.x+";imgY"+img.y)
                        img.x = mouseX + (img.x - mouseX) * 1.1;
                        img.y = mouseY +(img.y - mouseY) *1.1;
                        img.width = img.width * 1.1;
                        img.height = img.height * 1.1;
                    }
                    else
                    {
                        console.log("mouseX:"+mouseX+";mouseY:"+mouseY+";imgX:"+img.x+";imgY"+img.y)
                        img.x = mouseX + (img.x - mouseX) / 1.1;
                        img.y = mouseY +(img.y - mouseY) /1.1;
                        img.width = img.width /1.1;
                        img.height = img.height / 1.1;
                    }
                }
            }
 
        }
    }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值