QT-绘图机制

一，绘图的概述

绘图系统基于【QPainter】，【QPainterDevice】和【QPaintEngine】三个类

• QPainter（画家） 使用QPaintEngine（绘图工具）在QPainterDevice（绘图设备）上画画。
  
  注意：

1. 如果在主窗口上绘画 必须在【绘图事件】（paintEvent）中完成画画.

2. 绘图【事件】 调用的时机

• 窗口加载
  构造函数中实现
• update()

3. 虚函数重写

案例：窗口加载时调用

• 调用QPainter的方法
• 加载资源文件
  widget.h

virtual void paintEvent(QPaintEvent * event) ;

widget.cpp

//重写绘图事件【wideget中找到】[主窗口创建时调用]
void Widget::paintEvent(QPaintEvent *event)
{
    //定义一个画家
    QPainter*painter=new QPainter(this);
    //添加资源文件
    //定义图片空间
    QPixmap pix;//不定义图片加载不出来
    pix.load(":/04_Image/Luffy.png");
    //对图片进行修改
    pix.scaled(this->width(),this->height());//和窗口一样大
    painter->drawPixmap(0,0,this->width(),this->height(),pix);

}

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

widget.h

• 重写绘图事件
• 移动按键信号

public:
    explicit Widget(QWidget *parent = 0);
    ~Widget();
   virtual void paintEvent(QPaintEvent * event);

private slots:
    void on_pushButton_clicked();

widget.cpp

• 构造函数中调整button位置和大小
• 重写绘图事件
  静态变量存储当前位置
  调整边界
• ui【转到槽】

#include "widget.h"
#include "ui_widget.h"
#include<QPixmap>
#include<QPainter>
Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    ui->setupUi(this);
    this->resize(800,600);
    //将button移动到正下方
    //窗口的宽高
//    this->height();
//    this->width();
//    ui->pushButton->width();
//    ui->pushButton->height();
    //坐标是左上角
     ui->pushButton->resize(120,80);
    ui->pushButton->move(0.5*(this->width()-ui->pushButton->width()),
                         this->height()-ui->pushButton->height());
//    connect(ui->pushButton,&QPushButton::clicked,[=]()
//    {
//        //重新加载绘图事件
//        this->update();
//    });
}

Widget::~Widget()
{
    delete ui;
}
//重写绘图事件
void Widget::paintEvent(QPaintEvent * event)
{
    static int x=0;//不是静态变量下次调用还是0
    QPainter*painter=new QPainter(this);

    QPixmap pix;
    pix.load(":/04_Image/Sunny");
    pix.scaled(pix.width()*0.5,pix.height()*0.5);

    painter->drawPixmap(x,0,pix.width(),pix.height(),pix);
    x+=2;
    if(x>=this->width())
    {
        x=0;
    }
}

void Widget::on_pushButton_clicked()
{
    this->update();
    //加一个定时器
}

二，画家的其他绘制函数

1、划线drawLine

2、画矩形

• 设置画笔
• 设置样式
• 设置颜色
  【 枚举】
  
  

3、画圆

三，绘图设备

绘图设备是指继承 QPainterDevice 的子类。Qt 一共提供了四个这样的类，分别是 QPixmap、QBitmap、QImage 和 QPicture。其中，

• QPixmap 专门为图像在屏幕上的显示做了优化
• QBitmap 是 QPixmap 的一个子类，它的色深限定为 1，可以使用 QPixmap 的isQBitmap()函数来确定这个 QPixmap 是不是一个 QBitmap。
• QImage 专门为图像的像素级访问做了优化。
• QPicture 则可以记录和重现 QPainter 的各条命令。

#include "widget.h"
#include "ui_widget.h"
#include<QPainter>
#include<QBitmap>
#include<QImage>
#include<QPicture>
Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    ui->setupUi(this);
    this->resize(800,600);
#if 0
    //定义一个Bitmap绘图设备
    QBitmap bit(200,200);
    QPainter painter(&bit);//指针
    painter.drawEllipse(QPoint(100,100),100,100);
    //保存图片
    bit.save("C:\\Users\\winder\\Desktop\\QTcode\\test_21\\bit01.jpg");
#endif
//当前窗口看不到，保存后打开才行
#if 0
    QImage img;//可以动他的像素
    img.load(":/04_Image/butterfly.png");
    for(int i=50;i<100;i++)
    {
        for(int j=50;j<100;j++)
        {
            int value=qRgb(255,0,0);
            img.setPixel(i,j,value);
        }
    }
    QPainter painter(&img);
     painter.drawEllipse(QPoint(100,100),100,100);
         img.save("C:\\Users\\winder\\Desktop\\QTcode\\test_21\\bit02.jpg");
#endif

#if 1
//绘图设备
    QPicture picture;
    //画家
    QPainter painter;
    //激励会图指令
    painter.begin(&picture);
    painter.drawEllipse(100,100,100,100);
    painter.end();
    picture.save("C:\\Users\\winder\\Desktop\\QTcode\\test_21\\pix.zl");

#endif
}

Widget::~Widget()
{
    delete ui;
}
void Widget::paintEvent(QPaintEvent *event)
{
#if 0
   QPainter *painter =new QPainter(this);
   painter->drawLine(0,0,200,200);
   //画家对画笔进行设置
   painter->setPen(Qt::red);
   painter->setPen(Qt::DotLine);
   painter->drawRect(0,0,40,50);
   painter->drawEllipse(200,200,100,100);
#endif

#if 1
   QPicture pic;
   QPainter painter(this);
   //绘图设备pic加载绘图指令
   pic.load("C:\\Users\\winder\\Desktop\\QTcode\\test_21\\pix.zl");
   painter.drawPicture(100,100,pic);

#endif
}