QT 在label上透明绘图

先看效果，点击《添加图片》按钮，显示图片（在红色背景label控件上再添加一层label显示图像，这个label显示的图像是透明的），调节doublespinbox，透明度可以调节。

一、新建TransparentDemo工程

二、在界面上添加label，修改样式表，将底色置为红色，作为北京

三、新建一个TransparentLabel类，继承自QLabel

此时，工程包括文件

五、在transparentlabel.h中添加

头文件

cpp 复制代码

#include <QLabel>
#include <QPainter>

添加构造函数

cpp 复制代码

TransparentLabel(QWidget *parent=nullptr);

添加重绘函数paintEvent

cpp 复制代码

void paintEvent(QPaintEvent *) override;

如下图

cpp 复制代码

#ifndef TRANSPARENTLABEL_H
#define TRANSPARENTLABEL_H

#include <QLabel>
#include <QPainter>
class TransparentLabel : public QLabel
{
public:
    TransparentLabel();
    TransparentLabel(QWidget *parent=nullptr);
protected:
    void paintEvent(QPaintEvent *) override;
};

#endif // TRANSPARENTLABEL_H

六、在transparentlabel.cpp中实现构造函数和重绘函数，如下

cpp 复制代码

#include "transparentlabel.h"

TransparentLabel::TransparentLabel()
{

}
TransparentLabel::TransparentLabel(QWidget* parent):QLabel(parent){

}

void TransparentLabel::paintEvent(QPaintEvent *){
    //读取图片路径
    QString imagePath= "D:\\picture\\ming3.png";
    //读取图片
    QPixmap pixmap(imagePath);
    //获取当前label的大小
    QRect rect=this->geometry();
    //将图像大小缩放适合label
    QPixmap scaledPixmap = pixmap.scaled(QSize(rect.width(),rect.height()));
    //在label上绘图
    QPainter painter(this);
    //设置透明度
    painter.setOpacity(0.4);
    //绘图
    painter.drawPixmap(0, 0,scaledPixmap);
    //将此label放在最上层
    this->raise();
}

七、在ui文件中添加 "添加图片" 按钮

八、在mainwindow.h中添加头文件和transparentlabel成员、添加图片按钮槽函数

cpp 复制代码

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <transparentlabel.h>
QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private slots:
    void on_pushButton_clicked();

private:
    Ui::MainWindow *ui;
    TransparentLabel *transparentLabel;
};
#endif // MAINWINDOW_H

九、在mainwindow.cpp中实现按钮槽函数，并且在构造函数中初始化transparentLabel变量，隐藏

cpp 复制代码

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    transparentLabel = new TransparentLabel(this);
    transparentLabel->hide();
}

MainWindow::~MainWindow()
{
    delete ui;
}


void MainWindow::on_pushButton_clicked()
{
    QRect label_geometry=ui->label->geometry();//获取label大小
    transparentLabel->setGeometry(label_geometry);//设置透明label的位置
    transparentLabel->show();//显示
}

十、运行效果，点击之后在红色背景label上显示透明的图像

20230801_155459

PS：添加doublespinbox调节透明度很简单，参见下一篇
QT在label上透明绘图（二）