更新和升级:
2018.12.20 : 版本V2.0
重要更新:
- 几乎重构所有API
- 重新实现模板基类
- 加入跨平台的边框阴影方案
强烈推荐使用V2.0,v1.0仅作为参考学使用
效果图:
GitHub: https://github.com/FlyWM/FramelessWindow-Qt (欢迎大家star!!! o( ̄▽ ̄)ブ)
文章主要参考 一去丶二三里 大大的博客https://blog.csdn.net/liang19890820/article/details/50557240,进行了一些改造和升级。
如果需要做出更漂亮的窗体界面,那么实现无边框的widget是非常有必要的。本文就实现了无边框的widget、Dialog、MessageBox等一些常用的控件,进行了一些美化,可以拖动、缩放、双击标题栏最大化还原等操作,并且能够实现windwos下的Aero效果,并封装成库,这样用在每个项目都会很方便。
先看下效果图:
##注意:该库是在 Windows+MingW 的环境下编译的。
####使用方法:
1、FramelessWindow:
#include "framelesswindow.h"
#include <QWidget>
#include <QApplication>
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
FramelessWindow *pWindow = new FramelessWindow();
QWidget *pCentralWidget = new QWidget(pWindow);
pWindow->setCentralWidget(pCentralWidget);
pWindow->show();
return a.exec();
}
2、FramlessDialog
...
FramelessDialog *pDialog = new FramelessDialog(pWindow);
QWidget *pDlgCentralWidget = new QWidget(pDialog);
QPushButton *pButton = new QPushButton(pDlgCentralWidget);
pDialog->setCentralWidget(pDlgCentralWidget);
pDialog->setModal(true);
pDialog->show();
...
3、FrameMessageBox
FramelessMessageBox::showInformation(pWindow, QObject::tr("提示!"), QObject::tr("自定义提示框!"));
其中的各个配色可以在qss文件中修改。
/**
* 自定义无边框窗体、对话框和提示框并封装成库/测试程序
*
* style.qss
* qss全局文件,设置界面的配色主题等。
*
* FlyWM_
* GitHub: https://github.com/FlyWM
* CSDN: https://blog.csdn.net/a844651990
*
*/
/********** 无边框主窗体 **********/
FramelessWindow#framelessWindow {
background-color: #323232;
}
/********************************/
/*********** 标题栏 **************/
QPushButton#minimizeButton {
border: none;
image: url(:/images/minimizeBtnWhite_16.png);
}
QPushButton#minimizeButton:hover {
background: #505050;
}
QPushButton#maximizeButton {
border: none;
image: url(:/images/restoreWhite_16.png);
}
QPushButton#maximizeButton:hover {
background: #505050;
}
QPushButton#maximizeButton[maximizeProperty=restore] {
image: url(:/images/restoreWhite_16.png);
}
QPushButton#maximizeButton[maximizeProperty=maximize] {
image: url(:/images/maximizeBtnWhite_16.png);
}
QPushButton#closeButton {
border: none;
image: url(:/images/closeBtnWhite_16.png);
}
QPushButton#closeButton:hover {
background: #505050;
}
QPushButton#minimizeButton:pressed {
background: #C8C8C8;
image: url(:/images/minimizeBtnBlack_16.png);
}
QPushButton#maximizeButton:pressed {
background: #C8C8C8;
image: url(:/images/restoreBlack_16.png);
}
QPushButton#closeButton:pressed {
background: #C8C8C8;
image: url(:/images/closeBtnBlack_16.png);
}
QLabel#titleLabel {
color: white;
}
/********************************/
/******* 自定义无边框提示框 *******/
FramelessMessageBox#framelessMessagBox {
background-color: #404040;
}
QLabel#messageTextLabel {
color: white;
font-family: "Microsoft Yahei";
font-size: 14pt;
}
QPushButton#yesButton {
background-color: red;
}
/********************************/
/******* 自定义无边框对话框 *******/
FramelessDialog#framelessDialog {
background-color: #2E2E2E;
}
/********************************/
代码下载:
提示: 尽量拉取GitHub上的代码,保证是最新的。
github: https://github.com/FlyWM
csdn: https://download.csdn.net/download/a844651990/10589445