【QT】坐标系统和坐标变换

目录

1 坐标变换函数

1.1 坐标平移

1.2 坐标旋转

1.3 缩放

1.4 状态保存与恢复

2 坐标变换绘图实例

2.1 绘制3个五角星的程序

2.2 绘制五角星的PainterPath的定义

3 视口和窗口

3.1 视口和窗口的定义与原理

3.2 视口和窗口的使用实例

4 绘图叠加的效果


1 坐标变换函数

        QPainter在窗口上绘图的默认坐标系统如图8-1所示,这是绘图设备的物理坐标。为了绘图 的方便,QPainter提供了一些坐标变换的功能,通过平移、旋转等坐标变换,得到一个逻辑坐标 系统,使用逻辑坐标系统在某些时候绘图更方便。坐标变换函数见表8-5。
        常用的坐标变换是平移、旋转和缩放,使用 世界坐标变换矩阵也可以实现这些变换功能,但 是需要单独定义一个 QTransform 类的变量,对于 QPainter 来说,简单的坐标变换使用 QPainter 自 有的坐标变换函数就足够了。

1.1 坐标平移

        坐标平移函数是translate(),其中一种参数形式的函数原型是:
void translate(qreal dx,qreal dy)
        表示将坐标系统水平方向平移个单位,垂直方向平移个单位,在缺省的坐标系统中,单位就是像素。如果是从原始状态平移(dx,dy),那么平移后的坐标原点就移到了(dx,dy)。
        假设一个绘图窗口宽度为300像素,高度为200像素,则其原始坐标系统如图8-10左所示; 若执行平移函数translate(150,100),则坐标系统水平向右平移150像素,向下平移100像素,平 移后的坐标系统如图8-10右所示,坐标原点在窗口的中心,而左上角的坐标变为(-150,-100), 右下角的坐标变为(150,100)。如此将坐标原点变换到窗口中心在绘制某些图形时是非常方便的。

1.2 坐标旋转

        坐标旋转的函数是rotate(),其函数原型为:
void rotate(qreal angle)
        它是将坐标系统绕坐标原点顺时针旋转angle角度,单位是度。当angle为正数时是顺时针旋 转,为负数时是逆时针旋转。
        在图8-10右的基础上,若执行rotate(90),则得到图8-11所示的坐标系统。
        注意:旋转之后并不改变窗口矩形的实际大小,只是改变了坐标轴的方向。      
        在图8-11的新坐标系下,窗口左上角的坐标变成了(-100,150),而右下角的坐标变成了(100,-150)。

1.3 缩放

        缩放函数是scale(),其函数原型为:
void scale(qreal sx,qreal sy)
        其中,sx,sy分别为横向和纵向缩放比例,比例大于1是放大,小于1是缩小。

1.4 状态保存与恢复

        进行坐标变换时,QPainter内部实际上有一个坐标变换矩阵,用save()保存当前坐标状态,用 restore()恢复上次保存的坐标状态,这两个函数 必须配对使用操作的是一个堆栈对象
        resetTransform()函数则是复位所有坐标变换操作,恢复原始的坐标系统。

2 坐标变换绘图实例

2.1 绘制3个五角星的程序

        创建一个基于QWidget的窗口的应用程序samp8_2,窗体上不放置任何组件。在Widget类的 构造函数和paintEvent()事件中编写代码,代码内容如下。
Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    ui->setupUi(this);
    setPalette(QPalette(Qt::white)); //设置窗口背景色
    setAutoFillBackground(true);
    resize(600,300); //固定初始化窗口大小
}

void Widget::paintEvent(QPaintEvent *event)
{
    QPainter    painter(this);//创建QPainter对象
    painter.setRenderHint(QPainter::Antialiasing);
    painter.setRenderHint(QPainter::TextAntialiasing);

//生成五角星的5个顶点的,假设原点在五角星中心
    qreal   R=100; //半径
    const   qreal Pi=3.14159;
    qreal   deg=Pi*72/180;
    QPoint points[5]={
        QPoint(R,0),
        QPoint(R*std::cos(deg),-R*std::sin(deg)),
        QPoint(R*std::cos(2*deg),-R*std::sin(2*deg)),
        QPoint(R*std::cos(3*deg),-R*std::sin(3*deg)),
        QPoint(R*std::cos(4*deg),-R*std::sin(4*deg)),
    };
//设置字体
    QFont   font;
    font.setPointSize(12);
    font.setBold(true);
    painter.setFont(font);
//设置画笔
    QPen    penLine;
    penLine.setWidth(2); //线宽
    penLine.setColor(Qt::blue); //划线颜色
    penLine.setStyle(Qt::SolidLine);//线的类型,实线、虚线等
    penLine.setCapStyle(Qt::FlatCap);//线端点样式
    penLine.setJoinStyle(Qt::BevelJoin);//线的连接点样式
    painter.setPen(penLine);
//设置画刷
    QBrush  brush;
    brush.setColor(Qt::yellow); //画刷颜色
    brush.setStyle(Qt::SolidPattern); //画刷填充样式
    painter.setBrush(brush);
//设计绘制五角星的PainterPath,以便重复使用
    QPainterPath starPath;
    starPath.moveTo(points[0]);
    starPath.lineTo(points[2]);
    starPath.lineTo(points[4]);
    starPath.lineTo(points[1]);
    starPath.lineTo(points[3]);
    starPath.closeSubpath(); //闭合路径,最后一个点与第一个点相连
    starPath.addText(points[0],font,"0"); //显示端点编号
    starPath.addText(points[1],font,"1");
    starPath.addText(points[2],font,"2");
    starPath.addText(points[3],font,"3");
    starPath.addText(points[4],font,"4");
//绘图
    painter.save(); //保存坐标状态
    painter.translate(100,120);
    painter.drawPath(starPath); //画星星
    painter.drawText(0,0,"S1");
    painter.restore(); //恢复坐标状态

    painter.translate(300,120); //平移
    painter.scale(0.8,0.8); //缩放
    painter.rotate(90); //顺时针旋转
    painter.drawPath(starPath);//画星星
    painter.drawText(0,0,"S2");

    painter.resetTransform(); //复位所有坐标变换
    painter.translate(500,120); //平移
    painter.rotate(-145); //逆时针旋转
    painter.drawPath(starPath);//画星星
    painter.drawText(0,0,"S3");
}
     运行该实例程序,得到如图8·12所示的结果,在窗口上绘制了3个五角星。
        第1个是原始的五角星;第2个是缩小为0.8倍,顺时针旋转90度的五角星;第3个是逆时 针旋转145度的五角星。这个程序中使用到了QPainterPath和QPainter的坐标变换功能。

2.2 绘制五角星的PainterPath的定义

        首先假设一个五角星的中心点是原点,第0个点在x轴上,五角星外接圆半径为100,计算 出5个点的坐标,保存在points数组中。
        然后定义了一个QPainterPath类的变量starPath,用于记录画五角星的过程,就是几个点的连 线过程,并且标注点的编号。使用QPainterPath的优点就是定义一个QPainterPath类型的变量记录
一个复杂图形的绘制过程后,可以重复使用。虽然points数组中的点的坐标是假设五角星的中心 点是原点,在绘制不同的五角星时只需将坐标平移到新的原点位置,就可以绘制不同的五角星。
        绘制第1个五角星的程序是:
    painter.save(); //保存坐标状态
    painter.translate(100,120);
    painter.drawPath(starPath); //画星星
    painter.drawText(0,0,"S1");
    painter.restore(); //恢复坐标状态
        这里,save()函数保存当前坐标状态(也就是坐标的原始状态),然后将坐标原点平移到(100,120), 调用绘制路径的函数drawPath(starPath)绘制五角星,在五角星的中心标注“S1”表示第1个五角星,最后调用restore()函数恢复上次的坐标状态。这样就以(100,120)为中心点绘制了第1个五角星。
        绘制第2个五角星的程序是:
    painter.translate(300,120); //平移
    painter.scale(0.8,0.8); //缩放
    painter.rotate(90); //顺时针旋转
    painter.drawPath(starPath);//画星星
    painter.drawText(0,0,"S2");
        这里首先调用坐标平移函数translate(300,120)。由于上次restore()之后回到坐标初始状态,所 以这次平移后,坐标原点到了物理坐标(300,120)。而如果没有上一个restore(),会在上一次的坐
标基础上平移。
        绘图之前调用了缩放函数scale(0.8,0.8),使得缩小到原来的0.8,再顺时针旋转90°,然后调 用绘制路径函数drawPath(starPath)绘制五角星,就得到了第2个五角星。
        绘制第3个五角星时首先使坐标复位,即:
painter.resetTransform();//复位所有坐标变换
        这样会复位所有坐标变换,又回到了原始坐标。

3 视口和窗口

3.1 视口和窗口的定义与原理

        绘图设备的物理坐标是基本的坐标系,通过QPainter的平移、旋转等变换可以得到更容易操 作的逻辑坐标。
        为了实现更方便的坐标, QPainter还提供了视口(Viewport)和窗口(Window)坐标系,通 过QPainter内部的坐标变换矩阵自动转换为绘图设备的物理坐标。
        视口表示绘图设备的任意一个矩形区域的物理坐标,可以只选取物理坐标的一个矩形区域用 于绘图。默认情况下,视口等于绘图设备的整个矩形区。
        窗口与视口是同一个矩形,只不过是用逻辑坐标定义的坐标系。窗口可以直接定义矩形区的 逻辑坐标范围。图8-13是对视口和窗口的图示说明。
        图8-13左图中的矩形框代表绘图设备的物理大小和坐标范围,假设宽度为300像素,高度为 200像素。现在要取其中间的一个正方形区域作为视口, 灰色的正方形就是视口 ,绘图设备的物 理坐标中,视口的左上角坐标为(50,0),右下角坐标为(250,200)。定义此视口,可以使用QPainter 的setViewport()函数,其函数原型为:
void QPainter::setViewport(int x,int y,int width,int height)
        要定义图8-13左图中的视口,使用下面的语句:
painter.setViewport(50,0,200,200);
        表示从绘图设备物理坐标系统的起点(50,0)开始,取宽度为200、高度为200的一个矩形区域 作为视口。
        对于图8-13左图的视口所表示的正方形区域,定义一个窗口(图8-13右图), 窗口坐标的中心在 正方形中心,并设置正方形的逻辑边长为100。可使用QPainter的setWindow()函数,其函数原型为:
void QPainter::setWindow(int x,int y,int width,int height)
        所以,此处定义窗口的语句是:
painter.setWindow(-50,-50,100,100);
        它表示对应于视口的矩形区域,其窗口左上角的逻辑坐标是(-50,-50),窗口宽度为100,高度 为100。这里设置的窗口还是一个正方形,使得从视口到窗口变换时,长和宽的变化比例是相同 的。实际可以任意指定窗口的逻辑坐标范围,长和宽的变化比例不相同也是可以的。

3.2 视口和窗口的使用实例

        使用窗口坐标的优点是,只需按照窗口坐标定义来绘图,而不用管实际的物理坐标范围的大小。 如在一个固定边长为100的正方形窗口内绘图,当实际绘图设备大小变化时,绘制的图形会自动变化大 小。这样,就可以将绘图功能与绘图设备隔离开来,使得绘图功能适用于不同大小、不同类型的设备。
        实例samp8_3演示了使用视口和窗口的方法,项目创建与samp8_1类似,只在Widegt的 paintEvent()事件里添加绘图代码。
void Widget::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    int W=width();
    int H=height();
    int side=qMin(W,H);//取长和宽的小值
    QRect rect((W-side)/2, (H-side)/2,side,side); //viewport矩形区
    painter.drawRect(rect); //Viewport大小
//    painter.setViewport((W-side)/2, (H-side)/2,side,side);//设置Viewport,物理坐标范围
    painter.setViewport(rect);//设置Viewport
    painter.setWindow(-100,-100,200,200); // 设置窗口大小,逻辑坐标
    painter.setRenderHint(QPainter::Antialiasing);
//    p.setRenderHint(QPainter::TextAntialiasing);

//设置画笔
    QPen pen;
    pen.setWidth(1); //线宽
    pen.setColor(Qt::red); //划线颜色
    pen.setStyle(Qt::SolidLine);//线的类型,实线、虚线等
    painter.setPen(pen);
    for(int i=0; i<36;i++)
    {
        painter.drawEllipse(QPoint(50,0),50,50);
        painter.rotate(10);
    }
}
        运行实例程序samp8_3,可以得到如图8-14所示的图形效果。当窗口的宽度大于高度时,以 高度作为正方形的边长;当高度大于宽度时,以宽度作为正方形边长,且图形是自动缩放的。
图8-14 实例samp8_3使用窗口坐标的绘图效果
        程序首先定义了一个正方形视口,正方形以绘图设备的长、宽中较小者为边长。 然后定义窗口,定义的窗口是原点在中心,边长为 200 的正方形。
图8-14的图形效果实际上是画了36个圆得到的,循环部分的代码如下:
for(int i=0; i<36;i++)
{
    painter.drawEllipse(QPoint(50,0),50,50);
    painter.rotate(10);
}
        每个圆的圆心在X轴上的(50,0),半径为50。画完一个圆之后坐标系旋转10°,再画相同的 圆,这就巧妙应用了坐标轴的旋转。

4 绘图叠加的效果

        对上面的程序稍作修改,增加渐变填充和叠加效果的设置。
void Widget::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    int W=width();
    int H=height();
    int side=qMin(W,H);//取长和宽的小值
    QRect rect((W-side)/2, (H-side)/2,side,side); //viewport矩形区
    painter.drawRect(rect); //Viewport大小
//    painter.setViewport((W-side)/2, (H-side)/2,side,side);//设置Viewport,物理坐标范围
    painter.setViewport(rect);//设置Viewport
    painter.setWindow(-100,-100,200,200); // 设置窗口大小,逻辑坐标
    painter.setRenderHint(QPainter::Antialiasing);
//    p.setRenderHint(QPainter::TextAntialiasing);

//设置画笔
    QPen pen;
    pen.setWidth(1); //线宽
    pen.setColor(Qt::red); //划线颜色
    pen.setStyle(Qt::SolidLine);//线的类型,实线、虚线等
    painter.setPen(pen);
//线性渐变
    QLinearGradient  linearGrad(0,0,100,0);//从左到右,
    linearGrad.setColorAt(0,Qt::yellow);//起点颜色
    linearGrad.setColorAt(1,Qt::green);//终点颜色
    linearGrad.setSpread(QGradient::PadSpread);  //展布模式
    painter.setBrush(linearGrad);

    //设置复合模式
    painter.setCompositionMode(QPainter::RasterOp_NotSourceXorDestination);
//    painter.setCompositionMode(QPainter::CompositionMode_Difference);
//    painter.setCompositionMode(QPainter::CompositionMode_Exclusion);
    for(int i=0; i<36;i++)
    {
        painter.drawEllipse(QPoint(50,0),50,50);
        painter.rotate(10);
    }
}

        在上面的程序中,对单个圆使用了线性渐变填充,单个圆从左到右,由黄色渐变为绿色。使用QPainter::setCompositionMode()函数设置组合模式,即后面绘制的图与前面绘制的图的叠加模式。函数参数是一个QPainter::CompositionMode枚举类型值,可以查看Qt帮助,这个枚举

类型有近40种取值,表示了后绘制图形与前面图形的不同叠加运算方式。

        图8-15是其中两种叠加模式下的绘图效果,可以发现采用不同的叠加模式,可以得到不同的绘图效果,甚至是意想不到的绚丽效果。用户可以自己修改程序,设置不同渐变颜色、渐变填充模式、不同叠加模式,也许能绘制出更炫的图形呢。

图8-15 渐变填充和叠加效果,(左)CompositionMode_Difference模式叠加,(右)RasterOp_NotSourceXorDestination模式叠加

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

高通GAIA V3命令参考手册的研读学习(十三):GAIA通知

如前文《高通GAIA V3命令参考手册的研读学习&#xff08;四&#xff09;》所述&#xff0c;PDU一共有四种&#xff0c;前面已经讲了命令、回应以及错误码&#xff0c;现在来看最后一种&#xff1a;通知。 4. QTIL GAIA通知 通知发送的方向&#xff0c;是由设备发送到移动应用…

CI/CD 管道安全:构建和部署之外的最佳实践

鉴于对快速创新和敏捷方法论采用的需求&#xff0c;持续集成/持续部署 (CI/CD) 管道已成为构建所有 DevOps 流程的基础。他们是高效交付的支柱。 事实上&#xff0c;根据持续交付状态报告&#xff0c;使用 CI/CD 工具与所有指标上更好的软件交付性能相关。 这些管道给组织带…

java代码中调用自定义函数

定义函数 CREATE DEFINERrootlocalhost FUNCTION test_fun1(num1 FLOAT,num2 FLOAT) RETURNS float BEGINDECLARE SUM FLOAT DEFAULT 0;SET SUMnum1num2;RETURN SUM; END <select id"cunchu" resultType"java.util.Map">SELECT test_fun1(1,2) as r…

MySQL索引原理以及SQL优化

案例 struct index_failure_t{int id;string name;int cid;int score;string phonenumber;}Map<int,index_failure>; 熟悉C的同学知道&#xff0c;上述案例中&#xff0c;我们map底层是一颗红黑树&#xff0c;一个节点存储了一对kv&#xff08;键值对&#xff09;&…

WPF应用程序(.Net Framework 4.8) 国际化

1、新建两个资源字典文件zh-CN.xaml和en-US.xaml&#xff0c;分别存储中文模板和英文模板 (1) zh-CN.xaml <ResourceDictionary xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml&q…

机器学习:Logistic回归(Python)

Logistic回归&#xff08;二分类&#xff09; logistic_regression_class2.py import numpy as np import matplotlib.pyplot as pltclass LogisticRegression:"""逻辑回归&#xff0c;采用梯度下降算法 正则化&#xff0c;交叉熵损失函数&#xff0c;实现二分…

机器学习 强化学习 深度学习的区别与联系

机器学习 强化学习 深度学习 机器学习 按道理来说&#xff0c; 这个领域&#xff08;机器学习&#xff09;应该叫做 统计学习 &#xff08;Statistical Learning&#xff09;&#xff0c;因为它的方法都是由概率统计领域拿来的。这些人中的领军人物很有商业头脑&#xff0c; 把…

[docker] 利用Dockerfile多级构建缩减镜像大小

一、nginx FROM centos:7 as build #基于centos7镜像 MAINTAINER nginx on centos7 by lxy-20240125 #注释信息 ADD nginx-1.24.0.tar.gz /opt/ #将nginx安装包传输到镜像中 RUN yum -y install pcre-devel zlib-devel gcc gcc-c make && \cd /opt/nginx-1.24.0 &…

什么是DDOS流量攻击,DDoS防护安全方案

随着互联网的发展普及&#xff0c;云计算成新趋势&#xff0c;人们对生活方式逐渐发生改变的同时&#xff0c;随之而来的网络安全威胁也日益严重&#xff01; 目前在网络安全方面&#xff0c;网络攻击是最主要的威胁之一&#xff0c;其中DDoS攻击是目前最为常见的网络攻击手段…

Android studio打包apk比较大

1.遇到的问题 在集成linphone打包时发现有118m&#xff0c;为什么如此之大额。用studio打开后发现都是c不同的pu架构。 2.解决办法 增加ndk配置&#xff0c;不选配置那么多的cpu结构&#xff0c;根据自己需要调整。 defaultConfig { applicationId "com.matt.linphoneca…

2023美赛A题之Lotka-Volterra【完整思路+代码】

这是2023年的成功&#xff0c;考虑到曾经付费用户的负责&#xff0c;2024年可以发出来了。去年我辅导队伍数量&#xff1a;15&#xff0c;获奖M为主&#xff0c;个别F&#xff0c;H&#xff0c;零S。言归正传&#xff0c;这里我开始分享去年的方案。由于时间久远&#xff0c;我…

FPGA——芯片手册学习(AD7606)

芯片手册学习&#xff08;AD7606&#xff09; 芯片封装图引脚功能图总结要操作的端口芯片时序 芯片封装图 引脚功能图 总结要操作的端口 6 PAR/SER/BYTE/ SEL :并行、串行、字节选择&#xff0c;我们使用并行&#xff0c;设置为0 7 STBY:睡眠控制&#xff0c;0电平睡眠 9 10 C…

8-小程序数据promise化、共享、分包、自定义tabbar

小程序API Promise化 wx.requet 官网入口 默认情况下&#xff0c;小程序官方异步API都是基于回调函数实现的 wx.request({method: , url: , data: {},header: {content-type: application/json // 默认值},success (res) {console.log(res.data)},fail () {},complete () { }…

银行数据仓库体系实践(14)--数据应用之内部报表及数据分析

在银行日常经营中&#xff0c;每个部门、分支行随时随地都需要进行数据统计和分析&#xff0c;才能对银行当前业务状况及时了解&#xff0c;以进行后续经营策略、营销活动、风险策略的调整和决策。那在平时进行数据分析时除了各数据应用系统&#xff08;如各类监管报表系统、财…

数据可视化 pycharts实现时间数据可视化

自用版 数据格式为&#xff1a; 运行效果为&#xff1a; from pyecharts import options as opts from pyecharts.charts import Polar, Page import csv filename "./hot-dog-places.csv" data_x [] data_y [] with open(filename) as f:reader csv.reade…

Android悬浮窗实现步骤详解

最近想做一个悬浮窗秒表的功能&#xff0c;所以看下悬浮窗具体的实现步骤 1、初识WindowManager 实现悬浮窗主要用到的是WindowManager SystemService(Context.WINDOW_SERVICE) public interface WindowManager extends ViewManager {... }WindowManager是接口类&#xff0c…

基于springboot招生管理系统源码和论文

在Internet高速发展的今天&#xff0c;我们生活的各个领域都涉及到计算机的应用&#xff0c;其中包括招生管理系统的网络应用&#xff0c;在外国招生管理系统已经是很普遍的方式&#xff0c;不过国内的管理网站可能还处于起步阶段。招生管理系统具有招生公告信息管理功能的选择…

三款精选数字孪生产品大比拼

作为一名数据可视化领域的资深用户&#xff0c;我接触过众多数据可视化产品。本文将介绍三款备受关注的数据可视化工具&#xff0c;并对它们进行详细的比较。 首先&#xff0c;让我们了解一下数据可视化产品的核心价值。在信息爆炸的时代&#xff0c;数据可视化成为快速理解复…

Kubernetes k8s

Kubernetes k8s 一个开源的容器编排引擎&#xff0c;用来对容器化应用进行自动化部署、 扩缩和管理。 从架构设计层面&#xff0c;k8s能很好的解决可用性&#xff0c;伸缩性&#xff1b;从部署运维层面&#xff0c;服务部署&#xff0c;服务监控&#xff0c;应用扩容和故障处…

C++——特殊类

特殊类 文章目录 特殊类一、请设计一个类&#xff0c;不能被拷贝二、请设计一个类&#xff0c;只能在堆上创建对象方案一&#xff1a;析构函数私有化方案二&#xff1a;构造函数私有化 三、请设计一个类&#xff0c;只能在栈上创建对象四、请设计一个类&#xff0c;不能被继承五…