Qt坐标系统之三个坐标系和两个变换

前言

Qt坐标系统由QPainter类控制。它和QPaintDeviceQPaintEngine类一起构成Qt绘图系统的基础。QPainter用于执行绘图操作,QPaintDeviceQPainter用来绘制的一个二维空间的抽象,QPaintEngine提供在不同设备绘图的接口。

Qt 的坐标分为逻辑坐标和物理坐标。在我们绘制时,提供给QPainter的都是逻辑坐标。所谓物理坐标,就是绘制底层QPaintDevice的坐标。单单只有逻辑坐标,我们是不能在设备上进行绘制的。要想在设备上绘制,必须提供设备认识的物理坐标。Qt 使用viewport-window机制将我们提供的逻辑坐标转换成绘制设备使用的物理坐标,方法是,在逻辑坐标和物理坐标之间提供一层"窗口"坐标。视口是由任意矩形指定的物理坐标窗口则是该矩形的逻辑坐标表示 。默认情况下,物理坐标和逻辑坐标一致的,都等于设备矩形。

正文

简述

三个坐标系

  • 逻辑坐标系(Logical Coordinate System
    也称为用户坐标系,是在编程时最常使用的坐标系。
    坐标原点(0,0)通常位于窗口的左上角,X轴向右增长,Y轴向下增长。
    通过逻辑坐标系来指定图形元素(如线条、矩形等)的位置和大小。
  • 窗口坐标系(Window Coordinate System
    是逻辑坐标系经过变换(如缩放、旋转等)后得到的坐标系。
    用于在绘制过程中表示图形元素在窗口中的实际位置。窗口决定了我是看你的一部分还是整体。
    QPainter内部使用的一个坐标系,用于将逻辑坐标转换为绘图设备(如屏幕、打印机等)上的物理坐标。
  • 物理坐标系(Physical Coordinate System
    也称为设备坐标系,代表了绘图设备(如屏幕、打印机等)上的实际坐标系统。
    物理坐标系的原点、坐标轴方向以及单位(通常是像素)由绘图设备决定。
    QPainter最终会将图形元素绘制到物理坐标系中。

也就是说我们在绘制图像的时候一般是先在逻辑坐标系上构建想法,然后调用相关代码进行绘制,然后编译器编译时会将我们绘制在逻辑坐标系上的图形转换到窗口坐标系,最后转换到物理坐标系
默认情况下这三种坐标系是等同的。

它们之间的转换关系

Logical Coordinate System ---> Window Coordinate System ---> Physical Coordinate System
逻辑坐标 setWindow()变换 窗口坐标 setViewport()变换 物理坐标

两个变换

  • setWindow() 变换
    用于设置窗口坐标系的范围。相当于给逻辑坐标系加一个方框,然后我只能看到这个方框里面的东西
    通过调用setWindow(xMin, yMin, xMax, yMax),可以指定窗口坐标系的左下角和右上角坐标。
    这个变换主要影响逻辑坐标系到窗口坐标系的映射关系,进而影响图形元素在窗口中的实际位置。
  • setViewport() 变换
    用于设置物理坐标系中用于绘图的矩形区域(即视口(如屏幕))。
    通过调用setViewport(x, y, width, height),可以指定视口在物理坐标系中的位置和大小。
    这个变换主要影响窗口坐标系到物理坐标系的映射关系,进而影响图形元素在物理设备上的实际绘制位置。

例子

首先调用resize(300,300), 然后绘制窗口的两条对角线(注意我们现在所使用的就是逻辑坐标系)

使用setWindow()

可以看到窗口大小本身并没有变化,但是线段更细了(上面两条挨着的是新绘制的),我就添加了一行代码painter.setWindow(0,0,600,600);这行代码的意思是我设置了一个新的逻辑坐标系,在该逻辑坐标系下,窗口原点位于该逻辑坐标系的(0,0)位置,窗口的宽和高分别为600(原逻辑坐标系 宽高为300,所以显得扩大了2倍;由于扩大了两倍,原先两个点相当于现在的一个点所以显得细了);然后我下面继续调用绘图时就会在这个新的逻辑坐标系下进行绘制,所以说300像素在新的逻辑坐标系中只能是中间的位置。

  • 如果设置painter.setWindow(0,0,600,600);painter.setWindow(0,0,150,150);会发生什么呢?

可以看到窗口大小本身并没有变化,但是线条显得更加粗了;这是由于在新的逻辑坐标系中窗口的大小被设置成了150x150;原先在逻辑坐标中是300x300,相当于压缩了,原先的两个点相当于现在的一个点。

  • 如果将painter.setWindow(0,0,600,600);改成painter.setWindow(20,30,520,180);会发生什么呢?

    为什么会这样呢?新画的对角线为什么会超出边界呢?此时的窗口坐标系的取值如何计算?其实这也很好理解,我有一条对角线,取它的两个端点(0,0),(75,75)这是它的逻辑坐标,它的窗口坐标怎么计算呢?
    对于(0,0):

((30 + 0 * 520/300),(20 + 0 * 180/300) = (30, 20 )

对于(75,75):

((30 + 75 * 520/300),(20 + 75 * 180/300) = (159.75, 65)

对于此时窗口坐标系的取值

横坐标的取值范围为[30, 490],纵坐标的取值范围为[20,160]

对于线段上的点总归有些计算完窗口坐标后会超出坐标取值范围,使得其不在窗口上

使用setViewport()

还是使用刚才的例子,不过有些变化

可以看到窗口大小本身并没有变化,但是线条显得更加粗了;这是因为painter.setViewport(0,0,600,600);意思是将绘图操作的视口设置为一个从 (0,0) 开始,宽度和高度都是 600 个单位(由于没有修改相应的窗口坐标,窗口坐标范围不变);这个代码相当于把整个物理坐标系翻倍了。也就是单位逻辑坐标变大了。原来逻辑坐标画1个像素点,现在相当于画2个。

  • 如果设置painter.setViewport(0,0,600,600);painter.setViewport(0,0,150,150);会发生什么呢?

可以看到窗口大小本身并没有变化,但是线条显得更加细了;这是因为painter.setViewport(0,0,150,150);意思是将绘图操作的视口设置为一个从 (0,0) 开始,宽度和高度都是 150 个单位(由于没有修改相应的窗口坐标,窗口坐标范围不变);这个代码相当于把整个物理坐标系缩小2倍了。也就是单位逻辑坐标变小了。比如(75,75)转换成窗口坐标后为

((0 + 75 * 150/300),(0 + 75 * 150/300)) = (37.5, 37.5)

而37.5在300*300的窗口坐标中只占了1/8

  • 如果设置painter.setViewport(0,0,600,600);painter.setViewport(20,30,540,120);会发生什么呢?

我们将物理坐标原点修改为 (20, 30),长540,高是 120 的矩形时,窗口坐标范围不变,也就是说,我们将物理宽 540px 映射成窗口宽 300px,物理高 120px 映射成窗口高 300px。那么坐标如何计算呢?

比如还是(0,0)与(75,75)

对于(0,0):

((20 + 0 * 540/300),(30 + 0 * 120/300) = (20, 30 )

对于(75,75):

((20 + 75 * 540/300),(30 + 75 * 120/300) = (155, 165)

对于此时窗口坐标系的取值

横坐标的取值范围为[20, 520],纵坐标的取值范围为[30,90]

遗留小问题,如果将paintEvent中的内容改成

cpp 复制代码
	QPainter painter(this);
    painter.setViewport(0, 0, 150, 150);
    painter.fillRect(0, 0, 150, 150, Qt::green);

那么将会有多少窗口被填充?

答案是1/16

相关推荐
wangjing_052226 分钟前
C语言练习.if.else语句.strstr
c语言·开发语言
Tony_long748330 分钟前
Python学习——字符串操作方法
开发语言·c#
SoraLuna1 小时前
「Mac玩转仓颉内测版26」基础篇6 - 字符类型详解
开发语言·算法·macos·cangjie
出逃日志1 小时前
JS的DOM操作和事件监听综合练习 (具备三种功能的轮播图案例)
开发语言·前端·javascript
前端青山2 小时前
React事件处理机制详解
开发语言·前端·javascript·react.js
black0moonlight3 小时前
ISAAC Gym 7. 使用箭头进行数据可视化
开发语言·python
时光の尘3 小时前
C语言菜鸟入门·关键字·int的用法
c语言·开发语言·数据结构·c++·单片机·链表·c
坊钰3 小时前
【Java 数据结构】时间和空间复杂度
java·开发语言·数据结构·学习·算法
Edward-tan3 小时前
c语言数据结构与算法--简单实现线性表(顺序表+链表)的插入与删除
c语言·开发语言·链表
武昌库里写JAVA4 小时前
一文读懂Redis6的--bigkeys选项源码以及redis-bigkey-online项目介绍
c语言·开发语言·数据结构·算法·二维数组