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;
}
}
} }
}
}

  

qml: 以鼠标为中心进行放缩;的更多相关文章

  1. html 出现粒子线条,鼠标移动会以鼠标为中心吸附的特效之canvas-nest.js插件

    我在网上看到一个很炫酷,很有趣的特效,网页上会有很多移动的粒子和线条,鼠标经过时会以鼠标为中心吸附过来,如果时间够久,会形成一个类似震动的.带辐条的车轮子的东西. 网上搜了一下,源码是github里面 ...

  2. qml 关于鼠标穿透的问题

    最近在开发过程中,遇到了鼠标穿透的问题.结合网上给予的方法,都试了一圈,在这里总结一下: import QtQuick 2.9import QtQuick.Window 2.2import QtQui ...

  3. QML鼠标事件实现变色矩形

    QML支持鼠标事件处理,我们可以利用这个来实现一个变色矩形示例,代码如下: import QtQuick 2.4 import QtQuick.Controls 1.3 import QtQuick. ...

  4. Qt 开启鼠标跟踪,自动激活mouseMoveEvent的问题

    最近在Qt上实现一个功能,鼠标在图片上移动,触发mouseMoveEvent事件,进而生成一个小的半透明窗口,放大显示以鼠标为中心的一个区域的图像并随鼠标移动.但是,必须鼠标摁下,才触发mouseMo ...

  5. HTML/JavaScript实现地图以鼠标为圆心缩放和移动

    代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  6. 让交互更加生动!有意思的鼠标跟随 3D 旋转动效

    今天,群友问了这样一个问题,如下所示的鼠标跟随交互效果,如何实现: 简单分析一下,这个交互效果主要有两个核心: 借助了 CSS 3D 的能力 元素的旋转需要和鼠标的移动相结合 本文,就将讲述如何使用纯 ...

  7. 【PCB】电子元件封装大全及封装常识

    电子元件封装大全及封装常识 电子元件封装大全及封装常识 一.什么叫封装封装,就是指把硅片上的电路管脚,用导线接引到外部接头处,以便与其它器件连接.封装形式是指安装半导体集成电路芯片用的外壳.它不仅起着 ...

  8. fackbook的Fresco (FaceBook推出的Android图片加载库-Fresco)

    [Android开发经验]FaceBook推出的Android图片加载库-Fresco   欢迎关注ndroid-tech-frontier开源项目,定期翻译国外Android优质的技术.开源库.软件 ...

  9. jQuery Mobile中文手册:开发入门

    jQuery Mobile 以“Write Less, Do More”作为目标,为所有的主流移动操作系统平台提供了高度统一的 UI 框架:jQuery 的移动框架可以让你为所有流行的移动平台设计一个 ...

随机推荐

  1. codeforces546C

    Soldier and Cards CodeForces - 546C Two bored soldiers are playing card war. Their card deck consist ...

  2. 洛谷 P2921 [USACO08DEC]在农场万圣节Trick or Treat on the Farm

    题目描述 每年,在威斯康星州,奶牛们都会穿上衣服,收集农夫约翰在N(1<=N<=100,000)个牛棚隔间中留下的糖果,以此来庆祝美国秋天的万圣节. 由于牛棚不太大,FJ通过指定奶牛必须遵 ...

  3. 洛谷P2822 组合数问题

    输入输出样例 输入样例#1: 1 2 3 3 输出样例#1: 1 输入样例#2: 2 5 4 5 6 7 输出样例#2: 0 7 说明 [样例1说明] 在所有可能的情况中,只有C_2^1 = 2C21 ...

  4. Snowflake Snow Snowflakes POJ - 3349 Hash

    题意:一个雪花有六个角  给出N个雪花 判断有没有相同的(可以随意旋转) 参考:https://blog.csdn.net/alongela/article/details/8245005 注意:参考 ...

  5. 洛谷P1047校门外的树题解

    题目 此题是一个模拟题,但需要注意的一点就是它的树是从数轴的0开始,所以我们也要从0开始,这样才能实现代码. 代码: #include<iostream> using namespace ...

  6. Android大学课件SQLite3 数据库操作

    一.数据库介绍 SQLite3:当有大量相似结构的数据需要存储的时候 . 其实SQLite3 就是一个文件,类似之前学过的MySQL SqlServer等. 二.SQLiteOpenHelper 是一 ...

  7. Codeforces715 B. Complete The Graph

    传送门:>Here< 题意:给出一张带权无向图,其中有一些边权为0.要求将边权为0的边的边权重置为一个任意的正整数,使得从S到T的最短路为L.判断是否存在这种方案,如果存在输出任意一种 解 ...

  8. virtualenv virtualenvwrapper 虚拟环境创建

    虚拟环境创建 安装 C:\Users\Python> pip install virtualenv Requirement already satisfied: virtualenv ) C:\ ...

  9. thusc2017

    巧克力 题目描述 "人生就像一盒巧克力,你永远不知道吃到的下一块是什么味道." 明明收到了一大块巧克力,里面有若干小块,排成

  10. Leetcode 80.删除排序数组中的重复项 II By Python

    给定一个排序数组,你需要在原地删除重复出现的元素,使得每个元素最多出现两次,返回移除后数组的新长度. 不要使用额外的数组空间,你必须在原地修改输入数组并在使用 O(1) 额外空间的条件下完成. 示例 ...