【Qt】仿360安全卫士界面(自定义阴影边框类)-卡核

00. 目录

文章目录

01. 概述

Qt默认的QDialog和QWidget都带有边框和标题栏。如何实现一个不带有标题栏的边框，并且边框带有阴影效果。其实很简单，我们只需要自定义QDialog类，然后实现重绘事件即可。

效果图如下所示(四周有阴影效果)：
在这里插入图片描述

02. 开发环境

Windows系统：Windows10

Qt版本：Qt5.15或者Qt6

03. 自定义阴影边框类设计与实现

shadowborderwidget.h

#ifndef SHADOWBORDERWIDGET_H
#define SHADOWBORDERWIDGET_H

#include <QDialog>
#include <QWidget>
#include <QMouseEvent>
#include <QPaintEvent>
#include <QPainterPath>
#include <QPainter>
#include <QtMath>


// 阴影边框

class ShadowBorderWidget : public QDialog
{
    Q_OBJECT
public:
    //构造函数
    explicit ShadowBorderWidget(QWidget *parent = 0);
    //析构函数
    ~ShadowBorderWidget();

    // QWidget interface
protected:
    virtual void mousePressEvent(QMouseEvent *event);
    virtual void mouseReleaseEvent(QMouseEvent *event);
    virtual void mouseMoveEvent(QMouseEvent *event);
    virtual void paintEvent(QPaintEvent *event);

private:
    QPoint movePoint;       //移动的点
    bool isMousePressed;    //鼠标左键是否按下


};

#endif // SHADOWBORDERWIDGET_H

shadowborderwidget.cpp

#include "shadowborderwidget.h"

/*
可以查看帮助文档：
void setWindowFlags ( Qt::WindowFlags type )
可以查看demo/example：
Window Flags Example.

this->setWindowFlags(Qt::Dialog | Qt::WindowMinimizeButtonHint);

setWindowFlags ( Qt::WindowFlags type )
Qt::FrameWindowHint:没有边框的窗口
Qt::WindowStaysOnTopHint://总在最上面的窗口
Qt::CustomizeWindowHint://自定义窗口标题栏,以下标志必须与这个标志一起使用才有效,
否则窗口将有默认的标题栏
Qt::WindowTitleHint:显示窗口标题栏
Qt::WindowSystemMenuHint://显示系统菜单
Qt::WindowMinimizeButtonHint://显示最小化按钮
Qt::WindowMaximizeButtonHint://显示最大化按钮
Qt::WindowMinMaxButtonsHint://显示最小化按钮和最大化按钮
Qt::WindowCloseButtonHint://显示关闭按钮

Qt::Drawer://去掉窗口左上角的图标，右上角的最大化最小化按钮

------解决方案--------------------
setWindowFlags(Qt::FramelessWindowHint);直接隐藏掉。。。

*/


//构造函数
ShadowBorderWidget::ShadowBorderWidget(QWidget *parent):QDialog(parent)
{
    //设置无边框
    setWindowFlags(Qt::FramelessWindowHint | Qt::Dialog);

    //设置半透明背景
    setAttribute(Qt::WA_TranslucentBackground);

    //默认鼠标左键没有按下
    isMousePressed = false;

}

//析构函数
ShadowBorderWidget::~ShadowBorderWidget()
{

}


//鼠标按下事件
void ShadowBorderWidget::mousePressEvent(QMouseEvent *event)
{
    //鼠标左键移动和改变大小
    if (event->button() == Qt::LeftButton)
    {
        isMousePressed = true;
    }

    //窗口移动的距离
    movePoint = event->globalPos() - pos();
}


//鼠标释放事件
void ShadowBorderWidget::mouseReleaseEvent(QMouseEvent *)
{
    isMousePressed = false;
}

//鼠标移动事件
void ShadowBorderWidget::mouseMoveEvent(QMouseEvent *event)
{
    //鼠标是否按下
    if (isMousePressed)
    {
        QPoint movePos = event->globalPos();
        move(movePos - movePoint);
    }
}


//重绘事件  设置阴影效果
void ShadowBorderWidget::paintEvent(QPaintEvent *)
{

    QPainterPath path;
    path.setFillRule(Qt::WindingFill);
    path.addRect(10, 10, this->width() - 20, this->height() - 20);

    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing, true);
    painter.fillPath(path, QBrush(Qt::white));

    QColor color(0, 0, 0, 50);
    for (int i = 0; i < 10; i++)
    {
        QPainterPath path;
        path.setFillRule(Qt::WindingFill);
        path.addRect(10 - i, 10 - i, width() - (10 - i) * 2, height() 
        - (10 - i) * 2);
        color.setAlpha(150 - qSqrt(i) * 50);
        painter.setPen(color);
        painter.drawPath(path);
    }
}

04. 测试代码

main.cpp

#include "widget.h"
#include "shadowborderwidget.h"

#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    ShadowBorderWidget *w1 = new ShadowBorderWidget;
    w1->show();


    return a.exec();
}