使用QT 开发不规则窗体

于 2024-04-10 23:27:59 发布
阅读量685 收藏 5
点赞数 8
文章标签： qt 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/x879014419/article/details/137614182
版权

使用QT 开发不规则窗体

不规则窗体

QT中开发不规则窗体有两种方法：（1）第一种方法，使用QWidget::setMask函数设置绘制区域，然后在paintEvent()绘制。（2）第二种方法，在窗体四周设置一圈QWidget,设置一些不规则的图片，达到不规则窗体的目的。本次介绍贴图的这种方法。

贴图法的不规则窗体

创建UI模板

在QT中创建一个UI窗体。
在这里插入图片描述

在上下左右不同的区域设置QWidget:（1）上方：左上角，右上角，上方正中是标题栏；（2）下方：左下角，下方正中，右下角。（3）窗体两侧（4）窗体正中是业务窗体的窗体，业务窗体下方放置两按钮【确定】【取消】

运行效果图：

在这里插入图片描述

创建一个父类

创建一个父类，用于显示不规则窗体的四周，以后的窗体就不用重新作，直接继承就可以了。为了简捷，就不用cpp,把代码直接写到头文件里。

#ifndef CUSTOM_DIALOG_BASE_H
#define CUSTOM_DIALOG_BASE_H

#include <QDialog>
#include <QDesktopWidget> 
#include <QApplication>
#include <QMouseEvent> 
#include <QDebug> 
#include <QKeyEvent> 
#include "ui_custom_dialog_base.h"
class custom_dialog_base : public QDialog
{
    Q_OBJECT

public:
    explicit custom_dialog_base(QWidget *parent = 0)
    {
        setWindowFlags(windowFlags() | Qt::FramelessWindowHint|Qt::Dialog);//无边框
        this->setAttribute(Qt::WA_TranslucentBackground, true);//窗体背景全透明
        ui.setupUi(this);
        m_bMouseLeftButtonPressed = false;
        m_bCtrlKeyPressed = false;

        connect(ui.pushButton_close, &QPushButton::clicked, this, &QDialog::close);

        connect(ui.pushButton_ok, &QPushButton::clicked, this, &QDialog::accept);

        connect(ui.pushButton_cancel, &QPushButton::clicked, this, &QDialog::reject);

        ui.label_title->installEventFilter(this);

    }

    ~custom_dialog_base(){};

    // 居中在父窗体中
    void centerParent()
    {
        QWidget* parentWidget = this->parentWidget();
        QRect rect = this->geometry();
        QRect rectParent;
        if(parentWidget != nullptr)
        {
            rectParent = parentWidget->geometry();
        }
        else
        {
            rectParent = QApplication::desktop()->geometry();
        }
        QPoint center = rectParent.center();
        int width = rect.width();
        int height = rect.height();
        this->setGeometry(center.x()-width/2, center.y() - height/2, width, height);
    }

     // 设置标题
    void setDialogTitle(const QString& strTitle)
    {
        ui.label_title->setText(strTitle);
    }
    //获取中间的内容面板
    QWidget* getContainerWidget() { return ui.inner_frame;  }

protected:
    // ctrl键按下
    virtual void  keyPressEvent(QKeyEvent *event)
    {
        if (event->key() &Qt::Key_Control)
        {
            m_bCtrlKeyPressed = true;
            this->setSizeGripEnabled(true);// ctrl键按下,显示窗体缩放抓手。
        }
    }

    // ctrl键松开
    virtual void  keyReleaseEvent(QKeyEvent *event)
    {
        if (event->key() &Qt::Key_Control)
        {
            m_bCtrlKeyPressed = false;
            this->setSizeGripEnabled(false);
        }
    }

    // 窗体移动实现
    bool eventFilter(QObject *obj, QEvent *event)
    {
         // ctrl键按下时返回
        if (m_bCtrlKeyPressed)
        {
            return false;
        }

        // 判断是标题栏
        if (obj == ui.label_title)
        {
            //鼠标左键按下
            if (event->type() == QEvent::MouseButtonPress)
            {
                m_bMouseLeftButtonPressed = true;
                m_pointMouseLeftButtonPressed = QCursor::pos();
                return true;
            }
            else if (event->type() == QEvent::MouseButtonRelease)
            {//鼠标左键松开
                m_bMouseLeftButtonPressed = false;
                return true;
            }
            else if (event->type() == QEvent::MouseMove && m_bMouseLeftButtonPressed)
            {//鼠标左键按下时移动鼠标，开始移动窗体
                QPoint offset = QCursor::pos() - m_pointMouseLeftButtonPressed;
                QPoint pos = this->pos();
                this->move(offset + pos);
                m_pointMouseLeftButtonPressed = QCursor::pos();
                return true;
            }
        }

        return false;
    }

private:
    Ui_custom_dialog_base ui;

    //鼠标是否按下
    bool m_bMouseLeftButtonPressed;

    //cltr键是否按下
    bool m_bCtrlKeyPressed;

    //按下后当前鼠标位置
    QPoint m_pointMouseLeftButtonPressed;
};
// 可以pro文件中加入custom_dialog_base.h,不要下句
#include "./moc/moc_custom_dialog_base.cpp"

#endif // CUSTOM_DIALOG_BASE_H

创建业务窗体

业务窗体直接继承custom_dialog_base 类。同样，把cpp省去。把代码直接写到头文件里。

#ifndef USER_DIALOG_H
#define USER_DIALOG_H

#include <QDialog>
#include <QDesktopWidget> 
#include <QApplication>
#include <QMouseEvent> 
#include <QDebug> 
#include <QKeyEvent> 
#include "ui_user_dialog.h"
#include "custom_dialog_base.h"

class user_dialog : public custom_dialog_base
{
    Q_OBJECT

public:
    explicit user_dialog(QWidget *parent = 0)
    {
        ui.setupUi(getContainerWidget());// 加载业务窗体，
        getContainerWidget()->setLayout(ui.formLayout_2);// 设置业务窗体的布局器到父类中的容器中。
        ui.formLayout_2->setSpacing(15);
    }

    ~user_dialog(){};

private:
    Ui_user_dialog ui;
};

// 可以在pro文件中加入user_dialog.h,不要下句
#include "./moc/moc_user_dialog.cpp"
#endif // USER_DIALOG_H

main函数直接调用user_dialog

在main里直接创建user_dialog的实例，显示不规则窗体。

#include <QApplication>
#include <QDir>
#include <QPushButton>
#include "user_dialog.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
	QFile file;
    QString strFile = QDir(QApplication::applicationDirPath()).canonicalPath() + "/ui.qss";
	file.setFileName(strFile);
	file.open(QFile::ReadOnly);
	file.seek(0);
    QString strQss= file.readAll();// 从ui.qss文件中读取样式
    a.setStyleSheet(strQss); // 设置样式
	user_dialog dlg;
    dlg.setDialogTitle(QString::fromLocal8Bit("窗体标题"));
    dlg.centerParent();// 居中父窗体。
    return dlg.exec();
}

创建QSS文件

把使用自己喜欢的图片放到资源文件中，供QSS文件使用。

qss文件：


QWidget#widget_topleft{
	background-color:transparent;
	border-image:url(:/resources/top_left.png);
}

QWidget#widget_topcenter{
	background-color:transparent;
	border-image:url(:/resources/top_center.png);
}

QWidget#widget_topright{
	background-color:transparent;
	border-image:url(:/resources/top_right.png);
}


QWidget#widget_bottomleft{
	background-color:transparent;
	border-image:url(:/resources/bottom_left.png);
}

QWidget#widget_bottom_center{
	background-color:transparent;
	border-image:url(:/resources/bottom_center.png);
}


QWidget#widget_bottomright{
	background-color:transparent;
	border-image:url(:/resources/bottom_right.png);
}



QWidget#widget_left{
	background-color:transparent;
	border-image:url(:/resources/left_center.png);
}

QWidget#widget_center{
	background-color:transparent;
	border-image:url(:/resources/center.png);
}


QWidget#widget_right{
	background-color:transparent;
	border-image:url(:/resources/right_center.png);
}

QPushButton#pushButton_close{
	background-color: transparent;
	background-image:url(:/resources/pushButton_close.png);
}

QLabel{
	font-size:16px;
	color:white;
}
QLabel#label_title{
	background-color: transparent;
    text-align: center;
	font-size:18px;
	color:white;
}


QLineEdit, QComboBox,QDateTimeEdit,QSpinBox {
	font-size:18px;
}

QSizeGrip {
      image: url(:/resources/resize_gripper.png);
      width: 32px;
      height: 32px;
  }

QPushButton#pushButton_ok,QPushButton#pushButton_cancel {
	background-color: transparent;
	border-image:url(:/resources/pushbutton.png);
	min-width:96px;
	min-height:32px;
}


QPushButton#pushButton_ok:pressed,QPushButton#pushButton_cancel:pressed {
	background-color: transparent;
	border-image:url(:/resources/pushbutton_pressed.png);
}


QPushButton#pushButton_ok:hover,QPushButton#pushButton_cancel:hover {
	background-color: transparent;
	border-image:url(:/resources/pushbutton_hover.png);
}

qrc文件：

<RCC>
    <qresource prefix="/">
        <file>./resources/top_left.png</file>
        <file>./resources/top_center.png</file>
        <file>./resources/top_right.png</file>
        <file>./resources/left_center.png</file>
        <file>./resources/center.png</file>
        <file>./resources/right_center.png</file>
        <file>./resources/bottom_left.png</file>
        <file>./resources/bottom_center.png</file>
        <file>./resources/bottom_right.png</file>
        <file>./resources/pushButton_close.png</file>
        <file>./resources/resize_gripper.png</file>
        <file>./resources/pushbutton.png</file>
        <file>./resources/pushbutton_pressed.png</file>
        <file>./resources/pushbutton_hover.png</file>
    </qresource>
</RCC>

完整的QT工程

工程文件下载，不完善之处，老铁们一块讨论。

我是包不同
关注
  • 8
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
Qt实现不规则窗体
m0_60440984的博客
07-29 1335
Qt实现不规则窗体
QT不规则窗体的使用
weixin_44011306的博客
04-03 74
不规则窗体的使用程序效果展示 程序 //.h #ifndef SHAPEWIDGET_H #define SHAPEWIDGET_H #include <QWidget> #include <QMouseEvent> #include <QPainter> #include <QPixmap> #include <QBitmap> cl...
QT窗口:透明与半透明、不规则异形窗口、控件透明与半透明、不规则异形按钮
野生猿-群号1025127672
02-23 7660
目录 1、主窗口全透明 2、主窗口半透明（以白里透红为例） 1、主窗口全透明 直接在UI的主窗口中，拖出几个控件，下图我放置了一个QPushButton按钮、QCheckBox复选框、设置了蓝色背景的QWidget。 然后用代码设置主窗体的透明： MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow) { ui->setupUi(this);
qt写的简单的不规则透明窗口
04-17
简单的不规则透明窗口，仅仅提供思路，初学者参考即可
Qt下实现不规则形状窗口显示
XCJandLL的博客
02-20 1763
本文实现了Qt下显示两个不规则形状的窗口demo，其中有Qt的窗口对话框和QPaintEvent及QMouseEvent的简单使用。
Qt 不规则窗口,不规则按钮，不规划控件 不规则界面
q610098308的专栏
02-14 1573
Qt 实现 不规则样式设置，不是视觉欺骗，是真正的不规则 ，点击外面不会触发按钮的点击信号.另一种方式实现，通过 setStyleSheet 这种方式用于 Button较多；//实际图片大小，否则会变成填充；效果，只有点击到有色图，才会有点击信号；实现了，按钮和图像一致；见视频，可见，点击到空白处，消失；可见实现了真正的无规则界面；显示成一张图片中的图形，使用带有透明区域的png图片；必须重新绘制，构造函数也一定要调用resize。另外一种方式实现，重写按钮类；
Qt不规则窗体
m0_73443478的博客
02-23 156
Qt不规则窗体
QT 开发不规则窗体的源程序
最新发布
04-10
贴图式开发不规则窗体的源程序。工程中经常用不规则窗体美化界面，使用项目赏心悦目。
Qt.rar_qt 不规则窗体_qt 窗体
09-22
Qt不规则窗体的实现,包括各种窗口实现的代码。
QT不规则窗体
03-01
QT不规则窗体是Qt库中的一个特性，它允许开发者创建具有非标准形状的窗口，这些窗口不再局限于传统的矩形，而是可以自定义为任意形状。这种技术在UI设计中非常有用，可以用来创建引人注目的应用界面，提高用户体验。...
Qt5开发及实例-CH407.rar,Qt5不规则窗体的实现方法代码
09-15
Qt5开发及实例,实例CH407,不规则窗体的实现方法。具体实现一个蝴蝶图形外沿形状的不规则形状对话框，也可以在不规则窗体上放置按钮等控件，可以通过鼠标左键拖曳窗体，单击鼠标右键关闭窗体。运行效果如图4.14所示。...
qt不规则窗体
12-09
在Qt框架中，不规则窗体（Irregular Windows）指的是那些可以拥有自定义形状，超出标准矩形边界的窗口。这种窗体允许开发者创建更具视觉吸引力和独特设计的应用程序。在本文中，我们将深入探讨如何在Qt中实现不规则...
Qt 实现绘制不规则窗口(控件)
qq_33259248的博客
12-07 246
Qt 实现绘制不规则窗口(控件)
QT学习（十八）——不规则窗口
weixin_45927758的博客
07-02 237
在窗口上贴图 void IrrWid::paintEvent(QPaintEvent *) { QPainter p(this); p.drawPixmap(rect(),QPixmap(":/new/prefix1/C:/Users/13764/Pictures/Saved Pictures/timgBOZIAIW6.jpg")); } ----------------------------------- 去除窗口的边框：windowFlags函数是为了获取窗口原来的标记
Qt—特殊效果窗体
Half-up的博客
04-01 2519
特殊窗体 不规则窗体 使用样式表可以实现矩形、圆形等规则形状的部件,不过,有时想设计一个不规则形状的部件或者窗口,使得应用程序的外观更加个性化。Qt中提供了部件遮罩( mask)来实现不规则窗体。 新建Qt Widgets应用,项目名称为mymask,基类选择QWidget,类名保持Widget不变。完成后向项目目录中放一张背景透明的PNG图片(笔者这里是yafeilinux.png),然后再向项目中添加一个Qt资源文件,建立好后先添加前缀“/image”,然后再将图片添加进来并保存更改。然后到设计模式,向
PyQT5 （九十六） 实现不规则窗口异形窗口 案例
Ggome的博客
01-13 1022
PyQt5 实现不规则窗口异形窗口 案例 通过mask实现异形窗口,需要一张透明的png图,透明部分被抠出,形成一个非矩形的区域 import sys from PyQt5.QtCore import Qt from PyQt5.QtGui import QIcon, QBitmap, QPainter, QPixmap from PyQt5.QtWidgets import QHBoxLayout, QPushButton, QMessageBox, QApplication, QVB...
Qt 不规则窗口
weixin_30279315的博客
07-06 58
项目工程目录： mywidget.h： #ifndef MYWIDGET_H #define MYWIDGET_H #include <QWidget> namespace Ui { class MyWidget; } class MyWidget : public QWidget { Q_OBJECT public: ...
QT 开发 纯C++ 不使用QT 库
05-12
如果不使用QT库，建议使用其他的GUI库，例如FLTK、wxWidgets、GTK等。这些库都提供了比较丰富的GUI控件和界面设计工具，可以极大地提高开发效率。同时，这些库也提供了跨平台的支持，可以在不同操作系统下运行。开发...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值