Qt QGraphicsView移动、缩放

news2024/9/22 21:36:35

原链接

首先需要明白,view在整个视图框架中的角色是用于显示scene的,所以决定了如何展示scene,包括scale()函数,用于放大缩小所展示的scene;centerOn()函数,决定scene的中心在何方。所有的操作,都不会直接改变scene,改变的只是如何展现scene。

view就像窗户,我们可以透过窗户看到窗外的景色。scene就像窗外的景色,需要窗户作为媒介才能够让我们看到,只不过这里的景色(scene)不一定会比窗户(view)大。并且,在窗户如何显示窗外的景色,也可以通过函数设置,比如我家窗户是个哈哈镜,那就可以放大缩小甚至扭曲景色。item就像是景色当中的花鸟鱼虫。如果懂PhotoShop的话,view就像是图层上的蒙版,scene就像是蒙版下的图像。

一、缩放

主要使用到scale()函数。该函数用于缩放场景,但是并不是改变了scene的大小尺寸,仅仅是改变了显示比例。

void QGraphicsView::scale(qreal sx, qreal sy)

我们需要两个参数,sx,sy,指的是沿x,y缩放的比例,而不是大小。举个栗子:

void MyView::wheelEvent(QWheelEvent *event)
{
    int wheelValue = event->angleDelta().y();
    double ratio = (double)wheelValue / (double)1200 + 1;
    scale(ratio, ratio);
}

MyView继承了QGraphicsView,并重写wheelEvent。每次滚动滚轮,都将放大原来的1.1倍,或是缩小原来的0.9倍。

二、移动

主要使用到centerOn()函数,用于将对应坐标的scene显示到view的中心位置。

坐标:

view和scene的原点都位于左上角。

特点:

在Qt的视图框架中,如果在scene中直接添加一个item,scene的大小就是这个item的boundingRect尺寸,也就是item的最大边界矩形。如果这个item是小于view的,那么这个item会显示在view的中心,就像这样。如果scene的尺寸是小于view的,也就是说view可以完全包含scene,那么是不能够通过centerOn来移动scene。只有当scene大于view,以至于view不能完全展示scene时,才可以通过centerOn移动。

如果事件传播正常,且item设置了QGraphicsItem::ItemIsMovable(可以在item的setFlag函数中设置),这个item可以直接移动,scene会自动变化大小以适应item。如果将item向scene的左上角移动,scene的原点依旧还是左上角,以view的视角来看,是scene右下角不变,向左上角延伸。如果将已经移动的item再移动回来,scene的大小也不会变化,换言之,scene只可能被item撑得更大,不能自动变小。

void QGraphicsView::centerOn(const QPointF &pos)

cneterOn函数接受一个point参数,用于定义view的中心位置,应该展示scene坐标的什么位置。

注意,这个移动是有极限的,如果scene尺寸本身就大于view,那么不会将scene移出view的范围,换言之,如论如何移动,scene一定会完全包围view。

那么我们思路就十分清晰了。如果我们想移动一个距离,假设移动的距离为offsetPoint,获取一个当前view视图中中心点在scene的坐标,currentScenePoint = mapToScene(MyView.width() / 2, MyView.height() / 2),那么计算出新的点并传入centerOn函数,centerOn( - (currentScenePoint - offsetPoint));

下面是示例,这个示例中展示了当鼠标点击空白区域时,通过拖拽移动scene。

void FunctionView::mousePressEvent(QMouseEvent *event)
{
    QGraphicsView::mousePressEvent(event);
    if(this->scene() == nullptr)
    {
        qDebug() << "The scene is null";
        return;
    }
    // 记录鼠标按下时的中心点坐标
    centerAnchor = mapToScene(event->pos()) - event->pos() + QPointF(width() / 2, height() / 2);
    // 记录当前鼠标在view中的位置,用来在mouseMove事件中计算偏移
    // 此处不将view坐标转换成scene坐标的原因是优化性能,在move的过程中会产生抖动
    posAnchor = event->pos();
    isMousePressed = true;
}
void FunctionView::mouseMoveEvent(QMouseEvent *event)
{
    QGraphicsView::mouseMoveEvent(event);
    QPointF offsetPos = event->pos() - posAnchor;
    if(isMousePressed){
        setTransformationAnchor(QGraphicsView::AnchorUnderMouse);
        centerOn(centerAnchor - offsetPos);
    }
}
void FunctionView::mouseReleaseEvent(QMouseEvent *event)
{
    QGraphicsView::mouseReleaseEvent(event);
    isMousePressed = false;
}

Tips:视图框架事件的传递顺序是view->scene->item,如果需要将事件继续向后传递,使用event->ignore()是没用的,猜测因为view看做是一个控件,scene和item都是控件内的组件,ignore只能处理控件到控件的事件,但是控件内的事件无能为力。这里可以使用QGraphicsView::mousexxxEvent(event)这样的函数,将event事件再次传入视图。上面的例子也是用到了这样的方法。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1536628.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

移动app测试的好处简析,有必要选择第三方软件测试机构吗?

移动app测试是指对移动应用程序进行全面、系统和深入的检查和验证&#xff0c;以确保其功能、性能和稳定性达到预期要求。在移动应用市场日益竞争激烈的今天&#xff0c;进行移动app测试是至关重要的。 一、移动app测试的好处&#xff1a;   1、具有确保应用质量的作用。通过…

集简云新增“AI图像生成与识别”功能:实现智能图像识别与理解场景

自OpenAI发布GPT-4V以来&#xff0c;也掀起了各大企业对于多模态大模型的研究热潮。和以往的生图模型相比&#xff0c;多模态模型已突破文本限制&#xff0c;图像理解和识别能力尤为突出。 本周&#xff0c;集简云上线AI图像识别与问答功能&#xff0c;集成OpenAI和Anthropic两…

复制浏览器请求到Postman

目录 1.复制链接 2.导入到Postman 1.复制链接 F12打开开发者模式 2.导入到Postman 如上图所示&#xff0c;参数及cookie等信息都被导入进来。

VUE自己项目做的时候遇到的疑惑问题

晚上还在疑惑为什么下面还有一个一模一样的 早上起来&#xff0c;神清气爽&#xff0c;想了一下。原来是我用了两个路由出口

C语言复杂度(个人笔记)

时间复杂度主要衡量一个算法的运行快慢. 空间复杂度主要衡量一个算法运行所需要的额外空间. 时间复杂度 算法中的基本操作的执行次数&#xff0c;为算法的时间复杂度. 只需要大概执行次数&#xff0c;我们使用大O的渐进表示法。(看谁对数学表达式的影响最大) 空间复杂度 是…

学习C++是否有必要学习Boost库?

C作为一门强大且灵活的编程语言&#xff0c;在软件开发领域有着广泛的应用。而在C的学习过程中&#xff0c;Boost库是一个经常被提及的重要资源。那么&#xff0c;对于C的学习者而言&#xff0c;是否有必要投入精力去学习Boost库呢&#xff1f;本文将就此问题展开详尽讨论。 一…

LVGL:拓展部件——键盘 lv_keyboard

一、概述 此控件特点&#xff1a; 特殊Button矩阵&#xff1a;lv_keyboard 本质上是一个经过定制的按钮矩阵控件。每个按钮都可以独立触发事件或响应。预定义的键映射&#xff1a;lv_keyboard 自带了一套预设的按键布局和对应的字符映射表&#xff0c;开发者可以根据需要选择…

js实现hash路由原理

一、简单的上下布局&#xff0c;点击左侧导航&#xff0c;中间内容跟对变化&#xff0c;主要技术使用js检测路由的onhashchange事件 效果图 二、话不多说&#xff0c;直接上代码 <!DOCTYPE html> <html lang"zh"><head><meta charset"…

[Java、Android面试]_11_线程的启动方式和区别

文章目录 1. 继承Thread类2. 实现Runnable接口3. 实现Callable接口4. 使用Executor框架4. 四者的区别 本人今年参加了很多面试&#xff0c;也有幸拿到了一些大厂的offer&#xff0c;整理了众多面试资料&#xff0c;后续还会分享众多面试资料。 整理成了面试系列&#xff0c;由于…

Qt教程 — 3.5 深入了解Qt 控件:Display Widgets部件(1)

目录 1 Display Widgets简介 2 如何使用Display Widgets部件 2.1 QLabel组件-显示图像或文本 2.2 QCalendarWidget组件-日历简单的使用 2.3 QLCDNumber组件-控件作时钟的显示 2.4 QProgressBar组件-模拟手机电池充电 2.5 QFrame组件-绘制水平/垂直线 Display Widgets将分…

【机器学习】基于树种算法优化的BP神经网络分类预测(TSA-BP)

目录 1.原理与思路2.设计与实现3.结果预测4.代码获取 1.原理与思路 【智能算法应用】智能算法优化BP神经网络思路【智能算法】树种优化算法&#xff08;TSA&#xff09;原理及实现 2.设计与实现 数据集&#xff1a; 多输入多输出&#xff1a;样本特征24&#xff0c;标签类别…

【vue-小知识】var、let 和 const之间的区别

文章目录 结论1、重复定义变量名var&#xff1a;允许重复定义变量名let和const&#xff1a;不可以重复定义变量名 2、修改值var&#xff1a;允许修改值let&#xff1a;允许修改值const&#xff1a;不允许修改值&#xff0c;会报错 3、变量提升var : 支持变量提升let和const&…

[ C++ ] STL---stack与queue

目录 stack简介 stack的常用接口 queue简介 queue的常用接口 stack的模拟实现 queue的模拟实现 stack简介 1. stack是具有后进先出操作的一种容器适配器&#xff0c;其只能从容器的一端进行元素的插入与删除操作&#xff1b; 2. stack是作为容器适配器被实现的&#xff0…

使用Barrier对齐ConstraintLayout几个控件的最高的一个

前提就是想让一个控件X&#xff0c;对齐A&#xff0c;B&#xff0c;C等控件最高的位置&#xff0c;直接看图。 看&#xff0c;由于name的一行&#xff0c;或者2行&#xff0c;会导致email行的高度&#xff0c;可能比image块高&#xff0c;也可能比image快矮。 那么&#xff…

【STC8A8K64D4开发板】第2-17讲:PCA实现数模转换(DAC)

第2-17讲&#xff1a;PCA实现数模转换&#xff08;DAC&#xff09; 学习目的了解DAC数模转换原理及RC积分电路原理。掌握STC8A8K64D4系列单片机实现DAC功能的硬件和软件设计。 DAC简介 DAC (全称是Digital to Analog Convertor)数模转换器是一种将数字信号转换为模拟信号&a…

vue3+threejs新手从零开发卡牌游戏(七):创建卡组

在开始前先优化下之前的代码&#xff1a; 在之前hand/p1.vue中为了定位 utils文件夹下新建common.ts&#xff0c;将一些公用方法提取出来放在这里&#xff1a; 在game/Cards.ts中&#xff0c;我们调整下卡牌的厚度&#xff0c;由原来的0.02改为0.005&#xff0c;原因是之前的…

ZHUTI主提2024夏季系列 —「逐·行」

ZHUTI主提全新发布2024夏季「逐行」系列&#xff0c;聚焦当下人与自然的关系&#xff0c;以衣为载体&#xff0c;秉承东方哲学的艺术理念&#xff0c;将美学艺术与主流时尚设计融合&#xff0c;赋予当代时装表达新方向&#xff0c;共创现代女性之美。 取自然之意境&#xff0c…

开发调试、远程访问、内网穿透解决方案集合

开发调试、远程访问、内网穿透解决方案集合 前言Cpolar下载安装配置与使用 Ngrok购买隧道下客户端配置与使用 ZeroTier注册与安装创建虚拟网络加入虚拟网络配置授权 花生壳Centos系统Ubuntu系统使用花生壳控制台SN码登录添加映射 Loophole通过CLI方式安装登录与注销简单使用身份…

数据结构--链表刷题(一)快慢指针

1.快慢指针 先看一道简单的题目&#xff1a;返回中间结点 这道题有一个最朴素的做法就是先遍历一边链表&#xff0c;设置计数器求出链表长度&#xff0c;再重新走1/2的链表长度&#xff0c;即可返回中间节点 // 第二种解法 //这种解法需要遍历两次链表ListNode cur1 head;int…

适用于vue3的vant4组件 没有日期时间选择器

项目中需要用到日期和时间一同选择的场景 本来想用 如下代码 van-datetime-picker 发现咋整也不好使 刚开始还以为是引入的问题 后来发现是vant4根本就没这玩应了… <van-datetime-pickerv-model"currentDate"type"datetime"title"选择完整时间&q…