Windows 10 64bit
Anaconda3 with python 3.8
PyQt5 5.15
qt-material 3.0.1
嫌自己画的 UI
界面太丑?一个个控件单独调整样式表太麻烦?那就试试本篇介绍的这个样式工具,qt-material
,它看起来类似于 Material Design
,除了支持 PyQt5
,它还支持 PyQt6
、PySide6
、PySide2
等 GUI
框架。
使用 pip
安装
pip install qt-material
库的使用,还是很简单的
- # 导入模块
- from qt_material import apply_stylesheet
-
- # 在app实例化之后,应用样式
- apply_stylesheet(app, theme='default_dark.xml')
我们看看一个简单 UI
界面的前后区别
qt-material
自带了很多的主题,可以通过方法 list_themes
来查看
- 'dark_amber.xml',
- 'dark_blue.xml',
- 'dark_cyan.xml',
- 'dark_lightgreen.xml',
- 'dark_pink.xml',
- 'dark_purple.xml',
- 'dark_red.xml',
- 'dark_teal.xml',
- 'dark_yellow.xml',
- 'light_amber.xml',
- 'light_blue.xml',
- 'light_blue_500.xml',
- 'light_cyan.xml',
- 'light_cyan_500.xml',
- 'light_lightgreen.xml',
- 'light_lightgreen_500.xml',
- 'light_orange.xml',
- 'light_pink.xml',
- 'light_pink_500.xml',
- 'light_purple.xml',
- 'light_purple_500.xml',
- 'light_red.xml',
- 'light_red_500.xml',
- 'light_teal.xml',
- 'light_teal_500.xml',
- 'light_yellow.xml'
如果是使用 light
类型的主题,需要在 apply_stylesheet
中使用参数 invert_secondary
,并将其设置为 True
(默认值是 False
)
apply_stylesheet(app, theme='light_blue.xml', invert_secondary=True)
除此之外,还有个非常有用的参数 extra
,它一般用来自定义颜色和字体
- extra = {
-
- # Button colors
- 'danger': '#dc3545',
- 'warning': '#ffc107',
- 'success': '#17a2b8',
-
- # Font
- 'font_family': 'Roboto',
- }
-
- apply_stylesheet(app, 'light_cyan.xml', invert_secondary=True, extra=extra)
然后就可以在 PyQt5
的控件中来使用了,如
- # 登录按钮使用 danger 的红色
- self.pushButton_login.setProperty('class', 'danger')
最后,来看看如何创建自己的主题。首先来到本地环境中主题文件所在的目录,也就是 xml
文件所在的目录
随便拷贝一个 xml
,然后重命名一下,比如 dark_custom_theme.xml
接着来修改一下该文件的内容,16进制的颜色值,大家可以到这个站点来选择 https://imagecolorpicker.com/,比较省心
-
"primaryColor">#2596be -
"primaryLightColor">#ffff74 -
"secondaryColor">#abdbe3 -
"secondaryLightColor">#4f5b62 -
"secondaryDarkColor">#e28743 -
"primaryTextColor">#000000 -
"secondaryTextColor">#ffffff
xml
修改完毕,就可以在代码里使用了
apply_stylesheet(app, 'dark_custom_theme.xml')
更多资料请参考官方网站 https://github.com/UN-GCPDS/qt-material