Qt-繪圖設備

1  簡介

參考視頻：https://www.bilibili.com/video/BV1XW411x7NU?p=40

Qt繪圖設備有三種：QPixmap、QBitmap、QImage、QPicture。

QPixmap：專門針對屏幕進行優化了，和平臺相關，不能對圖片進行修改。

QBitmap：QPixmap的一個子類，它的色深限定爲1（表示顏色的二進制位數），提供單色圖像，只有黑白兩色的圖像數據。

QImage：和平臺無關，能夠對圖片進行修改，可在線程中繪圖。

QPicture：保存繪圖的狀態爲二進制文件。

2  測試

（1）QPixmap和QBitmap的比較

說明：使用兩張背景色分別爲透明和白色的圖片，分別用QPixmap和QBitmap進行繪製，進行對比分析。

原始圖片：第一張背景爲透明，第二張背景爲白色。

    

 測試代碼：

 1 void Widget::paintEvent(QPaintEvent *event)
 2 {
 3     QPainter p(this);
 4 
 5     //QPixmap 圖片背景透明
 6     p.drawPixmap(0, 0, QPixmap(":/new/prefix1/image/butterfly.png"));
 7     //QBitmap 圖片背景透明
 8     p.drawPixmap(200, 0, QBitmap(":/new/prefix1/image/butterfly.png"));
 9 
10     //QPixmap 圖片背景白色
11     QPixmap pixmap;
12     pixmap.load(":/new/prefix1/image/butterfly1.png");
13     p.drawPixmap(0, 200, pixmap);
14     //QBitmap 圖片背景白色
15     QBitmap bitmap;
16     bitmap.load(":/new/prefix1/image/butterfly1.png");
17     p.drawPixmap(200, 200, bitmap);
18 }

運行結果：

能夠看出，使用QBitmap繪製，白色的背景在QBitmap中消失了，而透明色在QBitmap中轉換成了黑色；其餘顏色則是使用點的疏密程度來體現的。

（2）QPixmap繪製圖片

說明：在400x300的窗口中將背景色設置爲白色，並加載一個圖片，而後保存。

測試代碼：

 1 Widget::Widget(QWidget *parent) :
 2     QWidget(parent),
 3     ui(new Ui::Widget)
 4 {
 5     ui->setupUi(this);
 6 
 7     //繪圖設備： 400x300
 8     QPixmap pixmap(400, 300);
 9     QPainter p(&pixmap);
10     //填充背景
11     p.fillRect(0, 0, 400, 300, QBrush(Qt::white));
12     //pixmap.fill(Qt::white);
13     p.drawPixmap(0, 0, 80, 80, QPixmap("../image/face.png"));
14     //保存圖片
15     pixmap.save("../pixmap.png");
16 }

運行測試：

（3） QImage繪製圖片

 說明：使用QImage繪製圖片，並改變50x50的像素點的顏色，而後保存圖片。

測試代碼：

 1 Widget::Widget(QWidget *parent) :
 2     QWidget(parent),
 3     ui(new Ui::Widget)
 4 {
 5     ui->setupUi(this);
 6 
 7     //建立一個繪圖設備，背景是透明色
 8     QImage image(400, 300, QImage::Format_ARGB32);
 9     QPainter p;
10     p.begin(&image);
11     //繪圖
12     p.drawImage(0, 0, QImage("../image/face.png"));
13     //對繪圖設備前50個像素點進行操做
14     for (int i=0; i < 50; i++) {
15         for (int j=0; j < 50; j++) {
16             image.setPixel(QPoint(i, j), qRgb(0, 255, 0));
17         }
18     }
19     p.end();
20     image.save("../image.png");
21 }

運行結果：

（4）QPicture繪製圖片

說明：使用QPicture繪製圖片，並保存爲二進制文件，而後加載進行顯示。

繪製保存圖片的代碼：

 1 Widget::Widget(QWidget *parent) :
 2     QWidget(parent),
 3     ui(new Ui::Widget)
 4 {
 5     ui->setupUi(this);
 6 
 7     QPicture picture;
 8     QPainter painter;
 9     painter.begin(&picture);
10     painter.drawPixmap(0, 0, 80, 80, QPixmap("../image/face.png"));
11     painter.drawLine(50, 50, 150, 50);
12     painter.end();
13     //保存的是二進制文件
14     picture.save("../picture.png");
15 }

加載，繪製事件：

1 void Widget::paintEvent(QPaintEvent *event)
2 {
3     QPicture pic;
4     //加載文件
5     pic.load("../picture.png");
6 
7     QPainter p(this);
8     p.drawPicture(0, 0, pic);
9 }

運行測試：

（5）QPixmap與QImage之間的相互轉換

說明：QPixmap和QImage之間可使用函數相互轉換。

測試代碼：

 1 void Widget::paintEvent(QPaintEvent *event)
 2 {
 3     QPainter p(this);
 4     QPixmap pixmap;
 5     pixmap.load("../image/face.png");
 6 
 7     //QPixmap --> QImage
 8     QImage tempImge = pixmap.toImage();
 9     p.drawImage(0, 0, tempImge);
10 
11     QImage image;
12     image.load("../image/face.png");
13     //QImage --> QPixmap
14     QPixmap tmpPixmap = QPixmap::fromImage(image);
15     p.drawPixmap(200, 0, tmpPixmap);
16 }

運行結果：