Qt开源作品18-无边框背景透明窗体

Posted 2021-02-18 feiyangqingyun

一、前言

用Qt来做无边框北京透明窗体非常简单，根本不需要用什么系统层的API来实现透明什么的，Qt本身提供了很多种设置窗体透明的方法，除了可以设置窗体的属性为透明以外，还可以设置透明度函数，以及qss来设置透明度颜色等，方法很多，按照需要可以选用自己最合适的办法，如果想要整个窗体的背景图类似于无边框的异行，你只需要准备一张美工做好的png带透明的背景图即可，直接用qss的形式设置为窗体的背景图，你也可以用painter绘制上去，这样就可以产生各种奇形怪状的异行窗体，比如中间挖个洞的背景图，可以直接穿透桌面。

二、代码思路

Widget::Widget(QWidget *parent) : QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);

    this->setAttribute(Qt::WA_TranslucentBackground);
    this->setWindowFlags(Qt::FramelessWindowHint | Qt::WindowSystemMenuHint | Qt::WindowMinimizeButtonHint);
    ui->widget->installEventFilter(this);
    ui->widget->setStyleSheet(QString("background-image:url(:/image/%1.png);").arg(1));
}

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

bool Widget::eventFilter(QObject *watched, QEvent *evt)
{
    static int index = 1;
    static QPoint mousePoint;
    static bool mousePressed = false;

    QMouseEvent *event = static_cast<QMouseEvent *>(evt);
    if (event->type() == QEvent::MouseButtonPress) {
        if (event->button() == Qt::LeftButton) {
            mousePressed = true;
            mousePoint = event->globalPos() - this->pos();

            if (index == 5) {
                index = 1;
            } else {
                index++;
            }

            ui->widget->setStyleSheet(QString("background-image:url(:/image/%1.png);").arg(index));

            return true;
        } else {
            exit(0);
        }
    } else if (event->type() == QEvent::MouseButtonRelease) {
        mousePressed = false;
        return true;
    } else if (event->type() == QEvent::MouseMove) {
        if (mousePressed && (event->buttons() && Qt::LeftButton)) {
            this->move(event->globalPos() - mousePoint);
            return true;
        }
    }

    return QWidget::eventFilter(watched, event);
}

三、效果图

四、开源主页

以上作品完整源码下载都在开源主页，会持续不断更新作品数量和质量，欢迎各位关注。

1. 国内站点：https://gitee.com/feiyangqingyun/QWidgetDemo
2. 国际站点：https://github.com/feiyangqingyun/QWidgetDemo
3. 个人主页：https://blog.csdn.net/feiyangqingyun
4. 知乎主页：https://www.zhihu.com/people/feiyangqingyun/