Qt绘图机制

1、绘图的概述

图系统基于QPainter、QPainterDevice和QPainterEngine三个类
QPainter（画家）使用QPainterEngine（绘图工具）在QPainterDevice（绘图设备）上画画

注意：
1、如果在主窗口上绘画，必须在绘图事件（paintEvent）中完成绘画
2、绘图事件调用的时机（1、窗口加载 2、update()）



案例：画一个背景图
QPainter画家的方法：


mainwindow.h:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include 

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
    //重写绘图事件
    virtual void paintEvent(QPaintEvent *event);

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

mainwindow.cpp:

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include 
#include 

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
}

MainWindow::~MainWindow()
{
    delete ui;
}

//重写绘图事件，主窗口加载的时候调用
void MainWindow::paintEvent(QPaintEvent *event)
{
    //定义一个画家 画图片
    QPainter *p = new QPainter(this);
    //定义一个图片控件
    QPixmap pix = QPixmap();
    pix.load(":/image/help.png");
    //设置图片大小
    pix.scaled(this->width(),this->height());
    //画家在主窗口绘画
    p->drawPixmap(0,0,this->width(),this->height(),pix);

}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

运行结果：

案例2：通过update()重新加载绘图事件

mainwindow.h:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include 

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
    //重写绘图事件
    virtual void paintEvent(QPaintEvent *event);
    void add();

private slots:
    void on_pushButton_clicked();

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

mainwindow.cpp:

 *p = new QPainter(this);
    //定义一个图片控件
    QPixmap pix = QPixmap();
    pix.load(":/image/help.png");
    //设置图片大小
    //pix= pix.scaled(200,200);
    QSize picSize(this->width(),this->height());
    pix= pix.scaled(picSize,Qt::KeepAspectRatio);
    //画家在主窗口绘画
    p->drawPixmap(x,0,this->width(),this->height(),pix);
    x+=2;
    if(x >= this->width()){
        x = 0;
    }
    this->add();
}

void MainWindow::add()
{

}

void MainWindow::on_pushButton_clicked()
{
    this->update();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

2、画家的其它绘制函数

1、划线drawLine

//划线
QPainter *p = new QPainter(this);
p->drawLine(0,0,200,200);
1
2
3

2、画矩形

//画家对画笔进行设置


设置画笔颜色


设置样式：

void MainWindow::paintEvent(QPaintEvent *event)
{
    //画矩形
    QPainter *p = new QPainter(this);
    //p->setPen(Qt::DotLine);//样式
    //p->setPen(Qt::green);//颜色 红色
    //使用QPen类设置样式
    QPen pen1  = QPen(Qt::red,3,Qt::DashDotLine,Qt::RoundCap,Qt::RoundJoin);
    p->setPen(pen1);//颜色 红色
    p->drawLine(0,0,200,200);
    //画家对画笔进行设置
    p->drawRect(50,50,100,100);

    //另一种形式设置样式
    QPainter painter(this);
    QPen pen;  // creates a default pen
    pen.setStyle(Qt::DashDotLine);
    pen.setWidth(3);
    pen.setBrush(Qt::green);
    pen.setCapStyle(Qt::RoundCap);
    pen.setJoinStyle(Qt::RoundJoin);
    painter.setPen(pen);
    painter.drawRect(100,100,100,100);


}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

运行结果：

3、画圆

//画圆
painter.drawEllipse(QPoint(150,150),20,20);
//画椭圆
painter.drawEllipse(QPoint(250,250),20,30);

1
2
3
4
5

运行结果：

3、绘图设备

案例1：QBitmap
在mianwindow.cpp的构造函数中：

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //定义一个绘图设备
    QBitmap *bit = new QBitmap(200,200);
    //定义一个画家
    QPainter *p = new QPainter(bit);
    p->drawLine(0,0,200,200);
    //保存图片
    bit->save("E:\\bit01.jpg");
}
1
2
3
4
5
6
7
8
9
10
11
12
13

运行结果：

案例2：image的像素操作

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
      ui->setupUi(this);

    //添加一个绘图设备
    QImage qimage;
    qimage.load(":/image/age.jpg");//事先添加资源
    for(int i =50; i<100;i++){
        for(int j = 50; j< 100; j++){
            int value = qRgb(255,0,0);
            qimage.setPixel(i,j,value);
        }
    }
    QPainter *p = new QPainter(&qimage);
    p->drawLine(0,0,200,200);
    qimage.save("E:\\bit02.jpg");

}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

运行结果：

案例3：重现绘图指令

在mainwindow.cpp的构造函数中（保存绘图指令）

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
      ui->setupUi(this);
      //绘图设备
      QPicture *pic = new QPicture();
      //画家
      QPainter *p = new QPainter();
      //记录绘图指令
      p->begin(pic);
      p->drawLine(0,0,200,200);
      p->end();
      //保存绘图指令
      pic->save("E:\\bit03.zl");
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

运行结果：

重现bit03.zl 到主窗口中（绘图事件中完成）在mainwindow.cpp的绘图事件中写

void MainWindow::paintEvent(QPaintEvent *event)
{

    QPainter painter(this);
    QPicture pic = QPicture();
    pic.load("E:\\bit03.zl");
    painter.drawPicture(200,200,pic);
}
1
2
3
4
5
6
7
8

运行结果：