使用QSS美化PyQt5界面,分享4套超赞皮肤和QSS专用编辑器! |
您所在的位置:网站首页 › pyqt5代码界面美化 › 使用QSS美化PyQt5界面,分享4套超赞皮肤和QSS专用编辑器! |
QSS 全称 Qt Style Sheets(Qt样式表),用于美化Qt程序界面,类似于CSS,但不如CSS强大,选择器和属性较少。 本文主要介绍在PyQt5中使用QSS,但同样适用于C++ Qt,PySide6,PySide2 本文主要介绍QSS的加载使用以及分享,QSS本身的语法详解请参考官方文档和其他教程。 官方文档Customizing Qt Widgets Using Style Sheets Qt Style Sheets Reference 官方参考文档才是最官方全面的文档,有时间最好仔细阅读一下。 主要包括: 可应用样式表的控件列表属性列表图标列表属性值列表伪类选择器列表子控件控制列表内容非常多,在此就不展开了。 基本语法类似CSS,QSS每一条都是由一个选择器和一组声明构成: 选择器选出要对哪种控件进行样式修改, 每个声明都是键值对,键为属性,值为属性值 为降低耦合,往往把QSS写在一个单独的style.qss文件中,然后在main.py的QApplication或QMainWindow中加载样式 编写QSS新建一个扩展名为.qss的文件,如style.qss,编辑内容。(本文后面有完整的样式主题、QSS编辑器推荐) 把写好的.qss添加到qrc中 加载QSS创建一个加载QSS样式表的公共类: class QSSLoader: def __init__(self): pass @staticmethod def read_qss_file(qss_file_name): with open(qss_file_name, 'r', encoding='UTF-8') as file: return file.read()在代码中加载qss样式表: app = QApplication(sys.argv) window = MainWindow() style_file = './style.qss' style_sheet = QSSLoader.read_qss_file(style_file) window.setStyleSheet(style_sheet) window.show() sys.exit(app.exec_()) QSS 样式分享 Qt 官方例子Qt Style Sheets Examples Qt官方给出的一些小例子,不一定好看但有很强的学习参考性 Qt-MaterialUN-GCPDS/qt-material This is another stylesheet for PySide6, PySide2 and PyQt5, which looks like Material Design (close enough). “一个仿Material的样式,适用于PySide6, PySide2以及PyQt5” 使用这套样式表也非常简单,作者已经打包发布到了pypi,所以我们只需要 pip install qt-material安装,并在代码中import即可 # 使用例子 import sys # from PySide6 import QtWidgets # from PySide2 import QtWidgets from PyQt5 import QtWidgets from qt_material import apply_stylesheet # create the application and the main window app = QtWidgets.QApplication(sys.argv) window = QtWidgets.QMainWindow() # setup stylesheet apply_stylesheet(app, theme='dark_teal.xml') # run window.show() app.exec_()更多详细内容请查阅该项目的README QDarkStyleSheetThe most complete dark/light style sheet for Qt applications “最完整的深色/浅色Qt主题” 文档 GitHub 也可以通过pip直接安装使用 pip install qdarkstyle # PyQt5 使用例子 import sys import qdarkstyle from PyQt5 import QtWidgets # create the application and the main window app = QtWidgets.QApplication(sys.argv) window = QtWidgets.QMainWindow() # setup stylesheet app.setStyleSheet(qdarkstyle.load_stylesheet_pyqt5()) # or in new API app.setStyleSheet(qdarkstyle.load_stylesheet(qt_api='pyqt5')) # run window.show() app.exec_() 飞扬青云-QSS在飞扬青云的 QWidgetDemo 项目中的 styledemo 子项目包含了3套很好看的QSS样式 QSS目录链接 GTRONICK-QSSGTRONICK/QSS: QT Style Sheets templates 一组QSS样式 如果对上面推荐的这几个主题还不满意,你可以设计自己的QSS,下面推荐一些专用编辑器 QssStylesheetEditorGitHub首页 中文README QssStylesheetEditor 是一个功能强大的 Qt 样式表(QSS)编辑器,支持实时预览,自动提示,自定义变量, 支持预览自定义ui代码,引用QPalette等功能。 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-8W9Eyno8-1627095775002)(https://oss.muzing.top/image/QssStylesheetEditor_GUI(v1.7)].png) 这个软件有如下特点: Qss代码高亮,代码折叠Qss代码自动提示,自动补全实时预览 Qss 样式效果,可以预览几乎所有的 qtwidget 控件效果支持预览自定义界面代码支持在 Qss 中自定义变量自定义变量可以在颜色对话框中拾取变量的颜色支持通过颜色对话框改变QPalette,并在Qss中引用支持相对路径引用图片,以及引用资源文件中的图片支持切换不同的系统 theme,如 xp 主题,vista 主题等(不同 theme 下 qss 效果会略有差异)能够在 windows,linux,unix 上运行支持多国语言(目前已有中文,英文,俄文翻译)还有许多强大而实用的功能,可以在README中查看 QSS Editor🎨 Cross-platform application to edit and preview Qt style sheets (QSS). 跨平台的QSS编辑/预览应用 GitHub主页 GitHub realeases 下载地址2 在Pycharm中可以安装 Qt Style Sheet Highlighter 插件,提供对QSS的代码高亮功能 在VScode里可以安装 Qt for Python 插件,该插件不仅支持qss文件的代码高亮,还支持qml、qrc、pro等代码的高亮 本文首发于 muzing的个人博客 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |