AI 助理
备案控制台
开发者社区 云计算 文章 正文

lesson10-QT二维图形绘制

2016-02-16 1241
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 一、画图 1、QPainter Qt中定义了几种绘图设备，如QWidget、QPainter、QPixmap等等。他们都继承自QPaintDevice QPainter提供了许多高度优化的函数去完成GUI画图工作，可以画简单的或者复杂的图形。
一、 画图
1、QPainter
Qt中定义了几种绘图设备，如QWidget、QPainter、QPixmap等等。他们都继承自QPaintDevice
QPainter提供了许多高度优化的函数去完成GUI画图工作，可以画简单的或者复杂的图形。QPainter使用QWIdget的painter事件来画图，事件处理函数是paintEvent(QPaintEvent *e)
画图时首先要有一个QPainter实例
QPainter p；
启动画图功能,参数指定画图的父控件
p.begin(this)；
开始画图
p.drawRect(QRect r);
关闭画图功能
p.end();
整个绘图过程都是在Qt事件中
QPainter提供一系列的函数可以让我们画出一些基本图形

2、QPen
在画图的时候，QPen用来画轮廓线。因此我们可以使用QPen来改变图形的轮廓，例如可以画实线、虚线、点线等等

改变QPainter的画笔：
QPainter p;
QPen pen;
p.setPen(pen);

改变画笔自身的属性
pen.setColor(Qt::white);   //颜色
pen.setStyle(Qt::SolidLine);//样式


3、QBrush
在画图的时候，QBrush可以填充图形，例如可以将图形填充为黄色、绿色等等

改变QPainter的画笔：
QPainter p;
QBrush brush;
p.setBrush(brush);

改变画笔自身的属性
brush.setColor(Qt::white); //颜色
brush.setStyle(Qt::CrossPattern);//样式

update()函数会产生一个画图事件
 

4、update
update()函数会产生一个画图事件，当串口被隐藏、部件失效的时候，这个函数会产生一个事件

点击(此处)折叠或打开

  1. #include "MyDraw.h"

  3. MyDraw::MyDraw()
  4. {
  5.     //控件初始化
  6.     btn = new QPushButton("更改");
  7.     colorBoxInit();
  8.     styleBoxInit();
  9.     drawWidgetInit();
  10.     //水平布局
  11.     QHBoxLayout *hLay = new QHBoxLayout();
  12.     hLay->addWidget(colorBox);
  13.     hLay->addWidget(styleBox);
  14.     hLay->addWidget(btn);
  15.     //垂直布局
  16.     QVBoxLayout *vLay = new QVBoxLayout();
  17.     vLay->addLayout(hLay);
  18.     vLay->addWidget(drawWidget);
  19.     //加载布局
  20.     setLayout(vLay);
  21.     //绑定信号和槽函数
  22.     connect(btn, SIGNAL(clicked()), this, SLOT(changeSlot()));
  23.     //重定义窗口大小
  24.     resize(500,500);
  25. //    drawWidget->setPalette(QPalette(Qt::white));
  26. }
  27. void MyDraw::colorBoxInit()
  28. {
  29.     colorBox = new QComboBox();
  30.     QStringList color;
  31.     color"红""黄""蓝""绿""黑";
  32.     colorBox->addItems(color);
  33. }
  34. void MyDraw::styleBoxInit()
  35. {
  36.     styleBox = new QComboBox();
  37.     QStringList style;
  38.     style"实线""虚线""点划线";
  39.     styleBox->addItems(style);
  40. }
  41. void MyDraw::drawWidgetInit()
  42. {
  43.     drawWidget = new QWidget;
  44.     drawWidget->resize(400, 400);
  45. }

  47. void MyDraw::changeSlot()
  48. {
  49.     switch(colorBox->currentIndex())
  50.     {
  51.         case 0:
  52.             pen.setColor(Qt::red);
  53.             break;
  54.         case 1:
  55.             pen.setColor(Qt::yellow);
  56.             break;
  57.         case 2:
  58.             pen.setColor(Qt::blue);
  59.             break;
  60.         case 3:
  61.             pen.setColor(Qt::black);
  62.             break;
  63.         default:
  64.             break;
  65.     }
  66.     switch(styleBox->currentIndex())
  67.     {
  68.         case 0:
  69.             pen.setStyle(Qt::SolidLine);
  70.             break;
  71.         case 1:
  72.             pen.setStyle(Qt::DashLine);
  73.             break;
  74.         case 2:
  75.             pen.setStyle(Qt::DotLine);
  76.             break;
  77.         default:
  78.             break;
  79.     }
  80.     //event
  81.     update();
  82. }

  84. //绘图时间
  85. void MyDraw::paintEvent(QPaintEvent *e)
  86. {
  87.     p.begin(this);
  88.     p.setPen(pen);
  89.     QBrush brush;
  90.     brush.setStyle(Qt::CrossPattern);
  91.     p.setBrush(brush);
  92.     QRect rect(100, 100, 200, 400);
  93.     p.drawEllipse(rect);
  94.     p.end();
  95. }




二、坐标系变换
Qt的坐标系由QPainter控制，同时也由QPaintDevice控制。
QPaintDevice是物理坐标，QPainter是逻辑坐标。逻辑坐标和物理坐标默认是一致的，但是也可以变换。Qt坐标原点在左上角，x轴向右增长，y轴上下增长

QPainter提供了一些变换函数，可以实现坐标的变换
1）tanslate（x，y） 平移
2）scale（m，n）缩放
3）shear（x，y）扭曲
4）rotate（m）旋转

点击(此处)折叠或打开

  1. #include "MyDraw.h"

  3. MyDraw::MyDraw()
  4. {
  5.     //控件初始化
  6.     btn = new QPushButton("更改");
  7.     colorBoxInit();
  8.     styleBoxInit();
  9.     drawWidgetInit();
  10.     //水平布局
  11.     QHBoxLayout *hLay = new QHBoxLayout();
  12.     hLay->addWidget(colorBox);
  13.     hLay->addWidget(styleBox);
  14.     hLay->addWidget(btn);
  15.     //垂直布局
  16.     QVBoxLayout *vLay = new QVBoxLayout();
  17.     vLay->addLayout(hLay);
  18.     vLay->addWidget(drawWidget);
  19.     //加载布局
  20.     setLayout(vLay);
  21.     //绑定信号和槽函数
  22.     connect(btn, SIGNAL(clicked()), this, SLOT(changeSlot()));
  23.     //重定义窗口大小
  24.     resize(500,500);
  25.     drawWidget->setPalette(QPalette(Qt::white));
  26. }
  27. void MyDraw::colorBoxInit()
  28. {
  29.     colorBox = new QComboBox();
  30.     QStringList color;
  31.     color"红""黄""蓝""绿""黑";
  32.     colorBox->addItems(color);
  33. }
  34. void MyDraw::styleBoxInit()
  35. {
  36.     styleBox = new QComboBox();
  37.     QStringList style;
  38.     style"实线""虚线""点划线";
  39.     styleBox->addItems(style);
  40. }
  41. void MyDraw::drawWidgetInit()
  42. {
  43.     drawWidget = new QWidget;
  44.     drawWidget->resize(400, 400);
  45. }

  47. void MyDraw::changeSlot()
  48. {
  49.     switch(colorBox->currentIndex())
  50.     {
  51.         case 0:
  52.             pen.setColor(Qt::red);
  53.             break;
  54.         case 1:
  55.             pen.setColor(Qt::yellow);
  56.             break;
  57.         case 2:
  58.             pen.setColor(Qt::blue);
  59.             break;
  60.         case 3:
  61.             pen.setColor(Qt::black);
  62.             break;
  63.         default:
  64.             break;
  65.     }
  66.     switch(styleBox->currentIndex())
  67.     {
  68.         case 0:
  69.             pen.setStyle(Qt::SolidLine);
  70.             break;
  71.         case 1:
  72.             pen.setStyle(Qt::DashLine);
  73.             break;
  74.         case 2:
  75.             pen.setStyle(Qt::DotLine);
  76.             break;
  77.         default:
  78.             break;
  79.     }
  80.     update();
  81. }

  83. //绘图时间
  84. void MyDraw::paintEvent(QPaintEvent *e)
  85. {
  86.     //构造一个矩形
  87.     QRect rect(100,100,300,400);
  88.     //开始画图
  89.     p.begin(this);
  90.     //指定一个画刷
  91.     QBrush brush;
  92.     brush.setStyle(Qt::CrossPattern);
  93.     //加载画笔和画刷
  94.     p.setPen(pen);
  95.     p.setBrush(brush);
  96.     //画椭圆
  97.     p.drawEllipse(rect);

  99.     p.translate(100, 0);
  100.     p.drawEllipse(rect);
  101.     p.scale(0.5, 0.5);
  102.     p.drawEllipse(rect);

  104.     p.end();
  105. }



三、QImage
Qt提供了4个处理图像的类：QImage、QPixmap、QBitmap、QPicture

QImage可以直接存储像素数据
QPixmap用来在屏幕上显示图片
QPicture可以记录和重放QPainter类
QBitmap用来处理位图，继承自QPixmap

QImage支持的图像可以是单位、8位、32位、alpha混合格式
加载图像可以使用load()函数、loadFromData()函数；save()可以保存图像
size() height() width()可以获取图像的大小等信息
format()可以取出图像的格式
convertToFormat()可以转换图片格式

使用QPainter的drawImage方法可以将QImage图案画到窗口

点击(此处)折叠或打开

  1. #include "myImage.h"

  3. myImage::myImage()
  4. {
  5.     //控件初始化
  6.     openBtn = new QPushButton("打开");
  7.     saveBtn = new QPushButton("保存");
  8.     image.load("/cut.jpg");
  9.     QHBoxLayout *hLay = new QHBoxLayout();
  10.     hLay->addWidget(openBtn);
  11.     hLay->addWidget(saveBtn);
  12.     //布局
  13.     QVBoxLayout *vLay = new QVBoxLayout();
  14.     vLay->addLayout(hLay);
  15.     QWidget *widget = new QWidget();
  16.     widget->resize(500,500);
  17.     vLay->addWidget(widget);
  18.     //加载布局
  19.     setLayout(vLay);
  20.     resize(600,600);
  21.     //绑定信号
  22.     connect(openBtn, SIGNAL(clicked()), this, SLOT(openSlot()));
  23.     connect(saveBtn, SIGNAL(clicked()), this, SLOT(saveSlot()));
  24. }
  25. //槽函数
  26. void myImage::openSlot()
  27. {
  28.     //获取文件名字
  29.     QString str = QFileDialog::getOpenFileName(this, "打开文件", "/", "All File(*.*)");
  30.     //加载图片
  31.     image.load(str);
  32.     update();
  33. }
  34. //槽函数
  35. void myImage::saveSlot()
  36. {
  37.     bool ok;
  38.     //获取输入的信息
  39.     QString str = QInputDialog::getText(this, "输入对话框", "请输入名字", QLineEdit::Normal, "wj", &ok);

  41.     //保存图像
  42.     image.save(str + ".png");
  43. }
  44. void myImage::paintEvent(QPaintEvent *e)
  45. {
  46.     QPainter p(this);
  47.     p.drawImage(100,100,image);
  48. }




 




一生有你llx
目录
相关文章
泡沫o0
|
5月前
|
算法 数据可视化 程序员
【Qt UI】调色板QPalette类在Qt编程中的应用
【Qt UI】调色板QPalette类在Qt编程中的应用
泡沫o0
134 0
y2hr4cjzssnlm
|
计算机视觉
我的Qt作品（6）使用Qt完整解析dxf文件并绘制(支持椭圆和样条曲线)
我的Qt作品（6）使用Qt完整解析dxf文件并绘制(支持椭圆和样条曲线)
y2hr4cjzssnlm
1107 0
我的Qt作品（6）使用Qt完整解析dxf文件并绘制(支持椭圆和样条曲线)
国中之林
|
2月前
【qt】绘图
【qt】绘图
国中之林
27 0
游客fcvboot535try
|
算法 C++
成为Qt绘图高手，你需要掌握这些
成为Qt绘图高手，你需要掌握这些
游客fcvboot535try
266 0
DarkFire
|
11月前
EasyX趣味化编程note2，绘制基本图形（下）
EasyX趣味化编程note2，绘制基本图形（上）
DarkFire
116 0
DarkFire
|
11月前
|
开发者 Windows
EasyX趣味化编程note2，绘制基本图形（上）
EasyX趣味化编程note2，绘制基本图形
DarkFire
64 0
turbolove
|
XML JavaScript API
QT5图形与画图
Qt提供了很多关于获取窗体位置及显示区域大小的函数，如x( )、y()和pos()、 rect()、size()、geometry()等，统称为“位置相关函数”或"位置函数”，如图6.1 所示是几种主要的位置函数，图中清楚地标出了它们之间的区别。
turbolove
103 0
turbolove
|
机器学习/深度学习
QT+ OpenGL 变换
我们需要改变物体的位置 现有解决办法（每一帧，改变顶点位置（所有顶点）） 每个顶点使用向量表示，使用矩阵表示对应顶点的操作。
turbolove
84 0
前端杂货铺
【Three.js入门】图形用户界面GUI、BufferGeometry创建矩形、随机生成多个随机颜色的三角形
【Three.js入门】图形用户界面GUI、BufferGeometry创建矩形、随机生成多个随机颜色的三角形
前端杂货铺
228 0
游客nilbojqjhu5fm
|
数据可视化 计算机视觉
VTK 基础(一) — 常用控件介绍及实现圆锥体绘制
最近在做医学图像的相关处理，其中用到了可视化程序包 VTK,在学习过程中，准备写一系列相关教程，一方面用于巩固自己所学，主要自己太笨图片，另一方面加强一下知识理解。 利用 VTK 进行绘制物体时，常用到的组件有下面几种，为了加深理解，VTK 把一个物体的渲染过程比喻成了一场演出（真的很形象图片）：
游客nilbojqjhu5fm
961 0
VTK 基础(一) — 常用控件介绍及实现圆锥体绘制