1 简介
参考视频：https://www.bilibili.com/video/BV1XW411x7NU?p=37
参考文档：《Qt教程.docx》
本文简单介绍Qt的绘图与绘图设备。
Qt的绘图系统基于三个类：QPainter，QPainterDevice和QPaintEngine。它们之间的层次关系结构如下：
QPainter：用于执行绘图的操作，可以把它想象成画家；
QPaintDevice：一个二维空间的抽象，这个二维空间允许QPainter在其上进行绘制。想象成画板；
QPaintEngine：提供了画笔（QPainter）在不同的设备上进行绘制的统一的接口。对开发人员透明。
我们可以把QPainter理解成画笔；把QPaintDevice理解成使用画笔的地方，比如纸张、屏幕等；而对于纸张、屏幕而言，肯定要使用不同的画笔绘制，为了统一使用一种画笔，我们设计了QPaintEngine类，这个类让不同的纸张、屏幕都能使用一种画笔。
Qt 的绘图系统实际上是，使用QPainter在QPainterDevice上进行绘制，它们之间使用QPaintEngine进行通讯（也就是翻译QPainter的指令）。
2 测试
下面写个测试代码来进行说明。
功能：在窗口上绘制直线、矩形、椭圆、添加背景图等。
（1）创建一个带ui的QWidget工程
（2）实现过程
我们只需要重写绘图事件处理函数就可以了，也就是void paintEvent(QPaintEvent *event);
如果在窗口绘图，必须放在绘图事件里实现 ；窗口需要重绘的时候（状态改变）绘图事件内部自动调用。
（3）实现效果
最终实现的效果如下：
（4）步骤说明
1）首先，我们需要创建一个绘图对象，并指定绘图设备（也就是准备画家和画板）。有两种方式：
方式一：QPainter p(this); //创建画家，并指定当前窗口为绘图设备。
方式二：
QPainter p; //创建画家对象
p.begin(this); //指定当前窗口为绘图设备
//绘图操作
//p.drawxxxx();
p.end();
我们这里使用方式二。
2）上图中的线宽以及颜色，我们是使用画笔QPen实现的；上图中矩形和椭圆形中的填充色，我们是使用画刷QBrush实现的。
我们创建了画笔对象和画刷对象之后，需要把它们交给画家，也就是QPainter。
//定义画笔
QPen pen;
pen.setWidth(); //设置线宽5pix
//pen.setColor(Qt::red); //设置颜色
pen.setColor(QColor(, , )); //rgb设置颜色
pen.setStyle(Qt::DashLine); //设置风格
//把画笔交给画家
p.setPen(pen); //创建画刷对象
QBrush brush;
brush.setColor(Qt::red); //设置颜色
brush.setStyle(Qt::Dense1Pattern); //设置样式
//把画刷交给画家
p.setBrush(brush);
3）绘制背景图
使用drawPixmap函数，有好几种方式，这里说两种：
// p.drawPixmap(0, 0, width(), height(), QPixmap(":/new/prefix1/image/superman.jpg"));
p.drawPixmap(rect(), QPixmap(":/new/prefix1/image/background.png")); //获取矩形
4）绘制直线
上图中的第一个正方形是用直线拼出来的，绘制直线使用drawLine()函数。
//画直线
p.drawLine(, , , );
p.drawLine(, , , );
p.drawLine(, , , );
p.drawLine(, , , );
5）绘制矩形
//画矩形
p.drawRect(, , , );
6）绘制椭圆
//画圆
p.drawEllipse(QPoint(, ), , );
5）绘制笑脸
上图中显示点击按钮并让笑脸移动是使用update()函数实现的，当我们点击按钮时，就在按钮的槽函数中调用update()进行更新窗口。
//画笑脸
p.drawPixmap(x, , , , QPixmap(":/new/prefix1/image/face.png"));
下面给出widget.cpp的完整代码：
#include "widget.h"
#include "ui_widget.h"
#include <QPainter>
#include <QPen>
#include <QBrush> Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this); x = ;
} Widget::~Widget()
{
delete ui;
} void Widget::paintEvent(QPaintEvent *event)
{
//方式一：
// QPainter p(this); //方式二：
QPainter p; //创建画家对象
p.begin(this); //指定当前窗口为绘图设备
//绘图操作
//p.drawxxxx();
//画背景图
// p.drawPixmap(0, 0, width(), height(), QPixmap(":/new/prefix1/image/superman.jpg"));
p.drawPixmap(rect(), QPixmap(":/new/prefix1/image/background.png")); //获取矩形 //定义画笔
QPen pen;
pen.setWidth(); //设置线宽5pix
//pen.setColor(Qt::red); //设置颜色
pen.setColor(QColor(, , )); //rgb设置颜色
pen.setStyle(Qt::DashLine); //设置风格
//把画笔交给画家
p.setPen(pen); //创建画刷对象
QBrush brush;
brush.setColor(Qt::red); //设置颜色
brush.setStyle(Qt::Dense1Pattern); //设置样式
//把画刷交给画家
p.setBrush(brush); //画直线
p.drawLine(, , , );
p.drawLine(, , , );
p.drawLine(, , , );
p.drawLine(, , , ); //画矩形
p.drawRect(, , , ); //画圆
p.drawEllipse(QPoint(, ), , ); //画笑脸
p.drawPixmap(x, , , , QPixmap(":/new/prefix1/image/face.png")); p.end();
} void Widget::on_pushButton_clicked()
{
x += ;
if (x > width()) {
x = ;
}
//刷新窗口，让窗口重绘制，整个窗口都重绘
update(); //间接调用paintEvent
}
widget.h的代码：
#ifndef WIDGET_H
#define WIDGET_H #include <QWidget> namespace Ui {
class Widget;
} class Widget : public QWidget
{
Q_OBJECT public:
explicit Widget(QWidget *parent = );
~Widget(); protected:
//重写绘图事件
//如果在窗口绘图，必须放在绘图事件里实现
//绘图事件内部自动调用，窗口需要重绘的时候（状态改变）
void paintEvent(QPaintEvent *event); private slots:
void on_pushButton_clicked(); private:
Ui::Widget *ui;
int x; }; #endif // WIDGET_H
