【QT】QT从零入门教程(十三)：QT画笔工具QPainter (双缓冲绘图)

QPainter 用于执行绘图操作，其提供的 API 在 GUI 或 QImage、QOpenGLPaintDevice、QWidget 和QPaintDevice 显示图形（线、形状、渐变等）、文本和图像。

绘图系统由 QPainter 完成具体的绘制操作，QPainter 类提供了大量高度优化的函数来完成 GUI 编程所需要的大部分绘制工作。它可以绘制一切想要的图形，从最简单的一条直线到其他任何复杂的图形，例如：点、线、矩形、弧形、饼状图、多边形、贝塞尔弧线等。此外，QPainter 也支持一些高级特性，例如反走样（针对文字和图形边缘）、像素混合、渐变填充和矢量路径等，QPainter 也支持线性变换，例如平移、旋转、缩放。

QPainter 一般在部件的绘图事件 paintEvent() 中进行绘制，首先创建 QPainter 对象，然后进行图形的绘制，最后记得销毁 QPainter 对象。当窗口程序需要升级或者重新绘制时，调用此成员函数。使用 repaint()和 update() 后，调用函数 paintEvent()。

首先要理解双缓冲绘图，可以从博客简易画板(双缓冲绘图)中学习基本原理。

1.按鼠标，移动画图，现在看到画的的图形是在tempImage上，image待机.

2.松开鼠标，将tempImage上的图形复制到image上，但是tempImage上的图形并没有消失，因为它不是临时变量，这时看到的图形其实就是image和tempImage上两张图重合在一起的图像。

3.按下鼠标再次绘图（这时image和tempImage上都有刚才画好的图，即历史记录都保存下来了），这时的图又画在tempImage上，此时image待机，松开鼠标，tempImage的图形又画在了image上.

在原有基础上，添加自己想要的绘制功能，如钢笔、线条、圆形、椭圆、三角形、菱形、矩形、正方形、六边形。

#ifndef PAINTWIDGET_H
#define PAINTWIDGET_H#include <QtGui>
#include <QtWidgets>
#include <QMainWindow>class PaintWidget :public QLabel
{Q_OBJECT
public:explicit PaintWidget(QWidget *parent = 0);enum shape {Pen = 1,Line,Ellipse,Circle, Triangle, Rhombus, Rect, Square, Hexagon, Null};void paint(QImage &theImage);void setImage(QImage img);QImage getImage(); // 外部获取图像void setShape(PaintWidget::shape );                     // 设置绘制类型void setPenWidth(int w);                                // 设置画笔宽度void setPenColor(QColor c);                             // 设置画笔颜色protected:void paintEvent(QPaintEvent *);void mousePressEvent(QMouseEvent *);void mouseMoveEvent(QMouseEvent *);void mouseReleaseEvent(QMouseEvent *);private:PaintWidget::shape type;int penWidth; QColor penColor;QImage image;QImage tempImage;QPoint lastPoint;QPoint endPoint;bool isDrawing;
};#endif// !PAINTWIDGET_H

#include <QtGui>
#include <QtWidgets>
#include <QMainWindow>
#include "header/PaintWidget.h"PaintWidget::PaintWidget(QWidget *parent) :QLabel(parent)
{isDrawing = false;
}void PaintWidget::setImage(QImage img)              // 读入图像
{image = img; tempImage = image;
}QImage PaintWidget::getImage()                      // 外部获取图像
{if (image.isNull() != true)return image;
}void PaintWidget::setShape(PaintWidget::shape t)    // 设置绘制类型
{type = t;
}void PaintWidget::setPenWidth(int w)                    // 设置画笔宽度
{penWidth = w;
}void PaintWidget::setPenColor(QColor c)                         // 设置画笔颜色
{penColor = c;
}void PaintWidget::paintEvent(QPaintEvent *) {QPainter painter(this);if (isDrawing == true) {painter.drawImage(0, 0, tempImage);// 如果正在绘图，既鼠标点击或者正在移动，画在tempImage上  }else {painter.drawImage(0, 0, image);// 如果鼠标释放，将图保存在image上  }
}void PaintWidget::mousePressEvent(QMouseEvent *event) {if (event->button() == Qt::LeftButton) {lastPoint = event->pos();isDrawing = true;// 鼠标点击开始绘图，移动表示正在绘图  }
}void PaintWidget::mouseMoveEvent(QMouseEvent *event) {if (event->buttons() & Qt::LeftButton) {// 鼠标为左键且正在移动  endPoint = event->pos();tempImage = image;if (type == Pen) {// 如果工具为画笔，不用双缓冲直接画在画板上  paint(image);}else { // 否则用双缓冲绘图  paint(tempImage);}}
}
void PaintWidget::mouseReleaseEvent(QMouseEvent *event) {isDrawing = false;if (type != Pen) {paint(image);}
}void PaintWidget::paint(QImage &theImage) {QPainter p(&theImage);QPen apen;  apen.setWidth(penWidth);    // 设置画笔宽度apen.setColor(penColor);    // 设置画笔颜色p.setPen(apen);// 设置绘图工具画笔线条宽度为4                  p.setRenderHint(QPainter::Antialiasing, true); // 反走样int x1, y1, x2, y2;x1 = lastPoint.x();y1 = lastPoint.y();x2 = endPoint.x();y2 = endPoint.y();switch (type) {                 // 画图 case PaintWidget::Pen: {p.drawLine(lastPoint, endPoint);lastPoint = endPoint;break;}case  PaintWidget::Line: {p.drawLine(lastPoint, endPoint);break;}case PaintWidget::Ellipse: {p.drawEllipse(x1, y1, x2 - x1, y2 - y1);break;}case PaintWidget::Circle: {double length = (x2 - x1) > (y2 - y1) ? (x2 - x1) : (y2 - y1);p.drawEllipse(x1, y1, length, length);break;}case PaintWidget::Triangle: {int top, buttom, left, right;top = (y1 < y2) ? y1 : y2;buttom = (y1 > y2) ? y1 : y2;left = (x1 < x2) ? x1 : x2;right = (x1 > x2) ? x1 : x2;if (y1 < y2){QPoint points[3] = { QPoint(left,buttom),   QPoint(right,buttom),   QPoint((right + left) / 2,top) };p.drawPolygon(points, 3);}else{QPoint points[3] = { QPoint(left,top),  QPoint(right,top),  QPoint((left + right) / 2,buttom) };p.drawPolygon(points, 3);}break;}case PaintWidget::Rhombus: {int top, buttom, left, right;top = (y1 < y2) ? y1 : y2;buttom = (y1 > y2) ? y1 : y2;left = (x1 < x2) ? x1 : x2;right = (x1 > x2) ? x1 : x2;QPoint points[4] = { QPoint(left,(top + buttom) / 2),QPoint((left + right) / 2,buttom),QPoint(right,(top + buttom) / 2), QPoint((left + right) / 2,top) };p.drawPolygon(points, 4);break;}case PaintWidget::Rect: {p.drawRect(x1, y1, x2 - x1, y2 - y1);break;}case PaintWidget::Square: {double length = (x2 - x1) > (y2 - y1) ? (x2 - x1) : (y2 - y1);p.drawRect(x1, y1, length, length);break;}case PaintWidget::Hexagon: {QPoint points[6] = {QPoint(x1,y1),QPoint(x2,y1),QPoint((3 * x2 - x1) / 2,(y1 + y2) / 2),QPoint(x2,y2),QPoint(x1,y2),QPoint((3 * x1 - x2) / 2,(y1 + y2) / 2) };p.drawPolygon(points, 6);break;}case PaintWidget::Null:{;}default:break;}update();// 重绘
}

至于如何运用PaintWidget类，这里只是给个示例：

// 头文件
// 修改imgLabel的定义，原本是QLabel，现在改成PaintWidget
// 原本的图像显示方法也需要相应修改，即修改成imgLabel->setImage()和imgLabel->getImage()
PaintWidget *imgLabel;             // 图像显示框// cpp
// 需要时就使用setShape函数
imgLabel->setShape(PaintWidget::Null);      // 退出绘制模式
imgLabel->setShape(PaintWidget::Pen);       // 钢笔
imgLabel->setShape(PaintWidget::Line);      // 线条
imgLabel->setShape(PaintWidget::Ellipse);   // 椭圆
imgLabel->setShape(PaintWidget::Circle);    // 圆形
imgLabel->setShape(PaintWidget::Triangle);  // 三角形
imgLabel->setShape(PaintWidget::Rhombus);   // 菱形
imgLabel->setShape(PaintWidget::Rect);      // 矩形
imgLabel->setShape(PaintWidget::Square);    // 正方形
imgLabel->setShape(PaintWidget::Hexagon);   // 六边形

【QT】QT从零入门教程(十三)：QT画笔工具QPainter (双缓冲绘图)相关推荐

树莓派python界面qt_树莓派QT入门教程——使用Qt开发界面程序控制GPIO
树莓派QT入门教程--使用Qt开发界面程序控制GPIO 玩转树莓派2017-07-12 12:36 树莓派入门教程--使用Qt开发界面程序前言 Qt是一个1991年由奇趣科技开发的跨平台C++图形用 ...
[Qt教程] 第18篇 2D绘图（八）双缓冲绘图
[Qt教程] 第18篇 2D绘图(八)双缓冲绘图楼主发表于 2013-5-2 22:07:23 | 查看: 789| 回复: 1 双缓冲绘图版权声明该文章原创于Qter开源社区(www.qt ...
【Qt】2D绘图之双缓冲绘图
00. 目录文章目录 00. 目录 01. 概述 02. 开发环境 03. 绘制矩形 04. 双缓冲绘图 05. 附录 01. 概述所谓的双缓冲绘图的概念.双缓冲(double-buffers)绘 ...
Qt之旅---10 双缓冲绘图
1 基本知识但我们使用painter进行快速绘图时会看到类似图下的情况双缓冲绘图技术的原理用两个画布进行绘图,一个用于显示,一个用于绘制,也就是将图画之后再显示就可以避免上面的情况. 2 ...
EGE基础入门篇（九）：双缓冲与手动渲染
EGE专栏:EGE专栏上一篇:EGE基础入门篇(八):清屏与重绘下一篇: 文章目录一.双缓冲机制 1. 单缓冲绘图 1.1 单缓冲绘图的缺点 1.2 系统读取帧缓冲 2. 双缓冲绘图 2.1 双 ...
【QT】QT从零入门教程(一)：图像处理自编软件
自说自话寒假有了闲暇时间,于是决定做一个实际点的项目.在此之前,一直想做一款软件,把自己所学过的知识融汇进去,以软件界面的形式呈现出来.此前接触过OpenCV,学C++也有一段时间了,正好想从零 ...
【QT】QT从零入门教程(十七)：QT+OpenCV+VS 打包exe
1.在Debug模式下运行程序,生成exe. 2.在桌面上新建文件夹,名字最好为英文或数字,将项目生成的exe及所需资源文件夹(如Image文件夹)拷贝到文件夹中,在文件夹中新建一个txt,F:\QT ...
【QT】QT从零入门教程(十六)：QSS样式表
实现一个软件的基本界面和功能后,接下来要做的就是美化界面,这就用到了QSS样式表. QSS包含了一个样式规则序列,一个样式规则由一个选择器和声明组成,选择器指定哪些部件由规则影响,声明指定哪些 ...
【QT】QT从零入门教程(十五)：QImage和Mat的转换
QT处理图像用的是QImage类,而OpenCV处理图像则是使用cv::Mat类,如果要在QT中运用OpenCV,那就需要进行QImage和Mat的相互转换. // cv::Mat转换成QImag ...

【QT】QT从零入门教程(十三)：QT画笔工具QPainter (双缓冲绘图)

【QT】QT从零入门教程(十三)：QT画笔工具QPainter (双缓冲绘图)相关推荐

最新文章

热门文章