00. 目錄

文章目錄

• • 00. 目錄
  • 01. 概述
  • 02. 開發環境
  • 03. 簡單繪制圖片
  • 04. 平移圖片
  • 05. 縮放圖片
  • 06. 旋轉圖片
  • 07. 扭曲圖片
  • 08. 附錄

01. 概述

Qt提供了四個類來處理圖像數據：QImage、QPixmap、QBitmap和QPicture，它們都是常用的繪圖設備。其中QImage主要用來進行I/O處理，它對I/O處理操作進行了優化，而且可以用來直接訪問和操作像素；QPixmap主要用來在屏幕上顯示圖像，它對在屏幕上顯示圖像進行了優化；QBitmap是QPixmap的子類，用來處理顏色深度為1的圖像，即只能顯示黑白兩種顏色；QPicture用來記錄并重演QPainter命令。

02. 開發環境

Windows系統：Windows10

Qt版本：Qt5.15或者Qt6

03. 簡單繪制圖片

3.1 創建一個Qt Widgets應用，項目名稱為11PixMap，在類信息頁面，將基類選擇為QWidget，類名使用默認的Widget即可。

3.2 項目所在的目錄中添加一下幾張圖片

3.3 頭文件中添加重繪事件處理函數的聲明

protected:void paintEvent(QPaintEvent *);

3.4 源文件中先添加頭文件包含#include ，然后添加函數的定義

void Widget::paintEvent(QPaintEvent *) {QPainter painter(this);QPixmap pixmap;pixmap.load("../11Pixmap/image/a.png");painter.drawPixmap(0, 0, 128, 128, pixmap);}

drawPixmap()函數在給定的矩形中來繪制圖片，這里矩形的左上角頂點為(0, 0)點，寬128，高128，如果寬高跟圖片的大小比例不同，默認會拉伸圖片。運行效果如下圖所示。

04. 平移圖片

QPainter類中的translate()函數實現坐標原點的改變，改變原點后，此點將會成為新的原點（0，0）。

在paintEvent()函數里面繼續添加如下代碼：

void Widget::paintEvent(QPaintEvent *) {QPainter painter(this);QPixmap pixmap;pixmap.load("../11Pixmap/image/a.png");painter.drawPixmap(0, 0, 128, 128, pixmap);painter.translate(150, 150);painter.drawPixmap(0, 0, 128, 128, pixmap);}

這里將（150，150）設置為了新的坐標原點，所以下面在（0，0）點貼圖，就相當于在以前的（150，150）點貼圖。執行結果如下：

05. 縮放圖片

我們可以使用QPixmap類中的scaled()函數來實現圖片的放大和縮小。

這里有三個值，只看其示例圖片就可大致明白，Qt::IgnoreAspectRatio是不保持圖片的寬高比；Qt::KeepAspectRatio是在給定的矩形中保持寬高比；最后一個也是保持寬高比，但可能超出給定的矩形。這里給定的矩形是由我們顯示圖片時給定的參數決定的

程序示例

void Widget::paintEvent(QPaintEvent *) {QPainter painter(this);QPixmap pixmap;pixmap.load("../11Pixmap/image/a.png");painter.drawPixmap(0, 0, 128, 128, pixmap);painter.translate(150, 150);painter.drawPixmap(0, 0, 128, 128, pixmap);qreal width = pixmap.width();qreal height = pixmap.height();//將圖片的寬和高都縮小 并且在給定的矩形內保持寬高的比值不變。pixmap = pixmap.scaled(width * 0.2, height * 0.2, Qt::KeepAspectRatio);painter.translate(150, 150);painter.drawPixmap(0, 0, pixmap); }

執行結果

06. 旋轉圖片

旋轉使用的是QPainter類的rotate()函數，它默認是以原點為中心進行旋轉的。如果要改變旋轉的中心，可以使用前面講到的translate()函數完成。

在paintEvent()函數中繼續添加如下代碼：

void Widget::paintEvent(QPaintEvent *) {QPainter painter(this);QPixmap pixmap;pixmap.load("../11Pixmap/image/a.png");painter.drawPixmap(0, 0, 128, 128, pixmap);painter.translate(150, 150);//順時針旋轉90°painter.rotate(90);//恢復原點painter.translate(-150, -150);painter.drawPixmap(150, 150, 128, 128, pixmap); }

必須先改變旋轉中心，然后再旋轉，然后再將原點復原，才能達到想要的效果。運行程序，如下圖所示。

07. 扭曲圖片

實現圖片的扭曲，是使用的QPainter類的shear(qreal sh，qreal sv)函數完成的。它有兩個參數，前面的參數實現橫向變形，后面的參數實現縱向變形。當它們的值為0時，表示不扭曲。

在paintEvent()中繼續添加如下代碼：

void Widget::paintEvent(QPaintEvent *) {QPainter painter(this);QPixmap pixmap;pixmap.load("../11Pixmap/image/a.png");painter.drawPixmap(0, 0, 128, 128, pixmap);//橫向扭曲painter.shear(0.5, 0);painter.drawPixmap(150, 150, 128, 128, pixmap); }

執行結果如下：

08. 附錄

源碼下載：【Qt】2D繪圖之繪制圖片.rar

總結

以上是生活随笔為你收集整理的【Qt】2D绘图之绘制图片的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。