imagecomposition工程存放在Qt安裝目錄下的
Examples\Qt-x.xx.xx\widgets\painting\imagecomposition
目錄下。其中
x.xx.xx為Qt的版本號(hào)。該工程展示了QPainter::CompositionMode的含義。要弄懂本工程請(qǐng)先參考《QPainter類的CompositionMode各值含義》
，否則本工程對(duì)初學(xué)者很難弄懂。

預(yù)備知識(shí)：

把將要畫(huà)上去的顏色稱為“源顏色”，把原來(lái)的顏色稱為“目標(biāo)顏色”。初次畫(huà)的時(shí)候，窗體上什么都沒(méi)有，則窗體或窗體的一個(gè)區(qū)域（當(dāng)運(yùn)用裁剪時(shí)）為目標(biāo)，即將要畫(huà)上去的圖形為源。

弄懂本工程的關(guān)鍵是要搞懂QPainter類的CompositionMode各值含義、源圖像和目標(biāo)圖像的概念。

loadImage函數(shù)分析

該工程的loadImage函數(shù)代碼如下：

void ImageComposer::loadImage(const QString &fileName, QImage *image,QToolButton *button) {image->load(fileName);// Scale the image to given size*image = image->scaled(resultSize, Qt::KeepAspectRatio);QImage fixedImage(resultSize, QImage::Format_ARGB32_Premultiplied);QPainter painter(&fixedImage);painter.setCompositionMode(QPainter::CompositionMode_Source);painter.fillRect(fixedImage.rect(), Qt::transparent);painter.setCompositionMode(QPainter::CompositionMode_SourceOver);painter.drawImage(imagePos(*image), *image);painter.end();button->setIcon(QPixmap::fromImage(fixedImage));*image = fixedImage;recalculateResult(); }

當(dāng)代碼執(zhí)行到第11行但11行后的代碼沒(méi)執(zhí)行時(shí)，即將第12、13、19行代碼注釋掉，根據(jù)前面源和目標(biāo)的定義可以知道:此時(shí)窗體為目標(biāo)，fixedImage為源，根據(jù)《QPainter類的CompositionMode各值含義》文章對(duì)QPainter::CompositionMode_Source的描述，可以知道，此時(shí)只顯示源，但因?yàn)閒ixedImage設(shè)置為透明的，所以即使顯示的是源，但看到的是源后面的窗體，如下：

如果將第11行改為：

painter.fillRect(fixedImage.rect(), Qt::red);

則輸出如下：

因?yàn)樵词羌t色的，不再透明，所以看不到后面的窗體，顯示的是源的紅色。將第11行依然設(shè)置為紅色，取消12、13行注釋，則此時(shí)11行繪制上去的紅色QImage對(duì)象fixedImage為目標(biāo)，第13行繪制的image對(duì)象為源，因?yàn)槔L圖組合模式是QPainter::CompositionMode_SourceOver，根據(jù)《QPainter類的CompositionMode各值含義》文章對(duì)QPainter::CompositionMode_SourceOver的描述，可以知道此時(shí)目標(biāo)和源重疊的部分進(jìn)行混合，且源蓋住（遮擋住）目標(biāo)，沒(méi)有重疊部分各自保留即都繪制出來(lái)，結(jié)果如下：
將第11行依然設(shè)置為Qt::transparent，則如下：

在ImageComposer類的構(gòu)造函數(shù)中，通過(guò)本函數(shù)分別加載了兩張圖形，一張用于最左側(cè)QToolButton按鈕貼圖，一張用于中間QToolButton按鈕貼圖。

recalculateResult函數(shù)分析

函數(shù)代碼如下：

void ImageComposer::recalculateResult() {QPainter::CompositionMode mode = currentMode();QPainter painter(&resultImage);painter.setCompositionMode(QPainter::CompositionMode_Source);painter.fillRect(resultImage.rect(), Qt::transparent);painter.setCompositionMode(QPainter::CompositionMode_SourceOver);painter.drawImage(0, 0, destinationImage);painter.setCompositionMode(mode);painter.drawImage(0, 0, sourceImage);painter.setCompositionMode(QPainter::CompositionMode_DestinationOver);painter.fillRect(resultImage.rect(), Qt::white);painter.end();resultLabel->setPixmap(QPixmap::fromImage(resultImage)); }

代碼執(zhí)行到第7行時(shí)，即代碼如下：

void ImageComposer::recalculateResult() {QPainter::CompositionMode mode = currentMode();QPainter painter(&resultImage);painter.setCompositionMode(QPainter::CompositionMode_Source);painter.fillRect(resultImage.rect(), Qt::transparent);/* painter.setCompositionMode(QPainter::CompositionMode_SourceOver);painter.drawImage(0, 0, destinationImage);painter.setCompositionMode(mode);painter.drawImage(0, 0, sourceImage);painter.setCompositionMode(QPainter::CompositionMode_DestinationOver);painter.fillRect(resultImage.rect(), Qt::white);*/painter.end();resultLabel->setPixmap(QPixmap::fromImage(resultImage)); }

目標(biāo)是QLabel類型的resultLabel子窗體部件，源是透明的QImage類對(duì)象resultImage，采用CompositionMode_Source模式繪制，結(jié)果就是將resultImage貼在resultLabel子窗體部件上面，因?yàn)閞esultImage是透明的，所以至第7行時(shí)，resultImage繪制和沒(méi)繪制都一樣，你看到的都是resultLabel子窗體部件。代碼執(zhí)行到第8、9行時(shí)，即代碼如下：

void ImageComposer::recalculateResult() {QPainter::CompositionMode mode = currentMode();QPainter painter(&resultImage);painter.setCompositionMode(QPainter::CompositionMode_Source);painter.fillRect(resultImage.rect(), Qt::transparent);painter.setCompositionMode(QPainter::CompositionMode_SourceOver);painter.drawImage(0, 0, destinationImage);/* painter.setCompositionMode(mode);painter.drawImage(0, 0, sourceImage);painter.setCompositionMode(QPainter::CompositionMode_DestinationOver);painter.fillRect(resultImage.rect(), Qt::white);*/painter.end();resultLabel->setPixmap(QPixmap::fromImage(resultImage)); }

設(shè)置QPainter::CompositionMode_SourceOver模式后再以resultImage為畫(huà)布（繪圖設(shè)備）繪制了destinationImage，此時(shí)destinationImage為源，resultImage為目標(biāo)。根據(jù)《QPainter類的CompositionMode各值含義》文章對(duì)QPainter::CompositionMode_SourceOver的描述，可以知道此時(shí)目標(biāo)和源重疊的部分進(jìn)行混合，且源蓋住（遮擋住）目標(biāo)，沒(méi)有重疊部分各自保留即都繪制出來(lái)，結(jié)果如下紅色方框所示：

代碼執(zhí)行到第10、11行時(shí)，即代碼如下：

void ImageComposer::recalculateResult() {QPainter::CompositionMode mode = currentMode();QPainter painter(&resultImage);painter.setCompositionMode(QPainter::CompositionMode_Source);painter.fillRect(resultImage.rect(), Qt::transparent);painter.setCompositionMode(QPainter::CompositionMode_SourceOver);painter.drawImage(0, 0, destinationImage);painter.setCompositionMode(mode);painter.drawImage(0, 0, sourceImage);/* painter.setCompositionMode(QPainter::CompositionMode_DestinationOver);painter.fillRect(resultImage.rect(), Qt::white);*/painter.end();resultLabel->setPixmap(QPixmap::fromImage(resultImage)); }

根據(jù)界面的選擇來(lái)設(shè)置相應(yīng)的組合模式，并繪制sourceImage，此時(shí)第10行之前繪制的結(jié)果即destinationImage為目標(biāo)，即將要繪制的sourceImage為源，如下紅色方框?yàn)樵诮缑嫦吕蜻x擇組合模式為SourceOver的輸出：

代碼執(zhí)行到13行，即代碼如下時(shí)：

void ImageComposer::recalculateResult() {QPainter::CompositionMode mode = currentMode();QPainter painter(&resultImage);painter.setCompositionMode(QPainter::CompositionMode_Source);painter.fillRect(resultImage.rect(), Qt::transparent);painter.setCompositionMode(QPainter::CompositionMode_SourceOver);painter.drawImage(0, 0, destinationImage);painter.setCompositionMode(mode);painter.drawImage(0, 0, sourceImage);painter.setCompositionMode(QPainter::CompositionMode_DestinationOver);painter.fillRect(resultImage.rect(), Qt::white);painter.end();resultLabel->setPixmap(QPixmap::fromImage(resultImage)); }

此時(shí)resultImage為源，之前繪制的為目標(biāo)，又因?yàn)榈?2行設(shè)置模式為QPainter::CompositionMode_DestinationOver，即源圖像如果和目標(biāo)圖像有重疊，繪制時(shí)，則重疊部分是目標(biāo)圖像在源圖像上面（目標(biāo)遮擋住源），當(dāng)目標(biāo)的alpha為255時(shí)，源被目標(biāo)完全遮擋。重疊部分的源和重疊部分的目標(biāo)進(jìn)行混合，混合之后得出的RGBA值為重疊部分的RGBA值，沒(méi)有重疊部分各自保留即都繪制出來(lái)。所以最終的輸出結(jié)果如下：

可以結(jié)合《QPainter類的CompositionMode各值含義》文章對(duì)各個(gè)組合模式的描述，讀者自行選擇界面下拉框上的不同的模式進(jìn)行體會(huì)、理解。

總結(jié)

以上是生活随笔為你收集整理的imagecomposition工程分析的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。