【Qt】2D绘图之复合模式

桃扇骨 2022-11-12 13:48 175阅读 0赞

## 00. 目录 ##

### 文章目录 ###

*   *  00. 目录
     *  01. 概述
     *  02. 开发环境
     *  03. 程序示例
     *  04. 附录

## 01. 概述 ##

QPainter提供了复合模式（Composition Modes）来定义如何完成数字图像的复合，即如何将源图像的像素和目标图像的像素进行合并。QPainter提供的常用复合模式及其效果如下图所示。 其中普通的类型是SoiirceOver(通常被称为alpha混合），就是正在绘制的源像素混合在已经绘制的目标像素上，源像素的alpha分量定义了它的透明度，这样源图像就会以透明效果在目标图像上进行显示。当设置了复合模式，它就会应用到所有的绘图操作中，例如画笔、画刷、渐变和pixmap/image绘制等。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng_size_16_color_FFFFFF_t_70]

**enum QPainter::CompositionMode：**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng_size_16_color_FFFFFF_t_70 1]

## 02. 开发环境 ##

**Windows系统**：Windows10

**Qt版本**：Qt5.15或者Qt6

## 03. 程序示例 ##

程序示例

void Widget::paintEvent(QPaintEvent *)
    { 
        QPainter painter;
    
        QImage image(400, 300, QImage::Format_ARGB32_Premultiplied);
    
        // 绘制中心的正方形
        painter.begin(&image);
        painter.setBrush(Qt::green);
        painter.drawRect(100, 50, 200, 200);
    
        painter.setBrush(QColor(0, 0, 255, 150));
        painter.drawRect(50, 0, 100, 100);
        painter.setCompositionMode(QPainter::CompositionMode_SourceIn);
    
        painter.drawRect(250, 0, 100, 100);
        painter.setCompositionMode(QPainter::CompositionMode_DestinationOver);
    
        painter.drawRect(50, 200, 100, 100);
        painter.setCompositionMode(QPainter::CompositionMode_Xor);
    
        painter.drawRect(250, 200, 100, 100);
    
        painter.end();
    
        painter.begin(this);
        painter.drawImage(0, 0, image);
    
    }

运行结果  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng_size_16_color_FFFFFF_t_70 2]

这里先在Qlmage上绘制了一个矩形，然后又在这个矩形的4个角分别绘制了4个小矩形，每个小矩形都使用了不同的复合模式，并且使用了半透明的颜色进行填充。 第一个小矩形没有明确指定复合模式，它默认使用的是SourceOver模式。

## 04. 附录 ##

源码下载：[【Qt】2D绘图之复合模式.rar][Qt_2D_.rar]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng_size_16_color_FFFFFF_t_70]: /images/20221022/3d6ae64e650847c2a65652c20cca73d6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/2021032411213117.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210324112139954.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RlbmdqaW4yMDEwNDA0MjA1Ng==,size_16,color_FFFFFF,t_70
[Qt_2D_.rar]: https://download.csdn.net/download/dengjin20104042056/16083981