• PyQt5 主题美化


    软硬件环境

    • Windows 10 64bit

    • Anaconda3 with python 3.8

    • PyQt5 5.15

    • qt-material 3.0.1

    前言

    嫌自己画的 UI 界面太丑?一个个控件单独调整样式表太麻烦?那就试试本篇介绍的这个样式工具,qt-material,它看起来类似于 Material Design,除了支持 PyQt5,它还支持 PyQt6PySide6PySide2GUI 框架。

    安装

    使用 pip 安装

    pip install qt-material

    实操

    库的使用,还是很简单的

    1. # 导入模块
    2. from qt_material import apply_stylesheet
    3. # 在app实例化之后,应用样式
    4. apply_stylesheet(app, theme='default_dark.xml')

    我们看看一个简单 UI 界面的前后区别

    bd3bd1414666878371336ab11acfc307.png

    c96074bae7541e9a53ea0bff685eb639.png

    qt-material 自带了很多的主题,可以通过方法 list_themes 来查看

    1. 'dark_amber.xml'
    2. 'dark_blue.xml'
    3. 'dark_cyan.xml'
    4. 'dark_lightgreen.xml'
    5. 'dark_pink.xml'
    6. 'dark_purple.xml'
    7. 'dark_red.xml'
    8. 'dark_teal.xml'
    9. 'dark_yellow.xml'
    10. 'light_amber.xml'
    11. 'light_blue.xml'
    12. 'light_blue_500.xml'
    13. 'light_cyan.xml'
    14. 'light_cyan_500.xml'
    15. 'light_lightgreen.xml'
    16. 'light_lightgreen_500.xml'
    17. 'light_orange.xml'
    18. 'light_pink.xml'
    19. 'light_pink_500.xml'
    20. 'light_purple.xml'
    21. 'light_purple_500.xml'
    22. 'light_red.xml'
    23. 'light_red_500.xml'
    24. 'light_teal.xml'
    25. 'light_teal_500.xml'
    26. 'light_yellow.xml'

    如果是使用 light 类型的主题,需要在 apply_stylesheet 中使用参数 invert_secondary,并将其设置为 True (默认值是 False)

    apply_stylesheet(app, theme='light_blue.xml', invert_secondary=True)

    除此之外,还有个非常有用的参数 extra,它一般用来自定义颜色和字体

    1. extra = {
    2.     # Button colors
    3.     'danger''#dc3545',
    4.     'warning''#ffc107',
    5.     'success''#17a2b8',
    6.     # Font
    7.     'font_family''Roboto',
    8. }
    9. apply_stylesheet(app, 'light_cyan.xml', invert_secondary=True, extra=extra)

    然后就可以在 PyQt5 的控件中来使用了,如

    1. # 登录按钮使用 danger 的红色
    2. self.pushButton_login.setProperty('class''danger')

    1303eca274c6a2e8a138a649f4051b06.png

    最后,来看看如何创建自己的主题。首先来到本地环境中主题文件所在的目录,也就是 xml 文件所在的目录

    91d85185b0e3df7f8e75104e8e6bcc29.png

    随便拷贝一个 xml,然后重命名一下,比如 dark_custom_theme.xml

    bc9815378b1041c8af2f393f7c5c3460.png

    接着来修改一下该文件的内容,16进制的颜色值,大家可以到这个站点来选择 https://imagecolorpicker.com/,比较省心

    1.   "primaryColor">#2596be
    2.   "primaryLightColor">#ffff74
    3.   "secondaryColor">#abdbe3
    4.   "secondaryLightColor">#4f5b62
    5.   "secondaryDarkColor">#e28743
    6.   "primaryTextColor">#000000
    7.   "secondaryTextColor">#ffffff

    xml 修改完毕,就可以在代码里使用了

    apply_stylesheet(app, 'dark_custom_theme.xml')

    e7c5c8b99629740e1dc743e0503f7af3.png

    更多资料请参考官方网站 https://github.com/UN-GCPDS/qt-material

  • 相关阅读:
    05 CSS02
    yolo项目中如何训练自己的数据集
    6.9 条件变量的使用及注意事项
    CMake 安装升级更高版本
    在eclipse中配置weblogic12c1.1.0
    springboot+java大学生新生入学报到报道系统+jsp004
    k8s 部署mysql8(PV和PVC 版本)
    C++ 哈希
    电脑重装系统后DirectX12旗舰版禁用了怎么解决?
    适合自学的网络安全基础技能“蓝宝书”:《CTF那些事儿》
  • 原文地址:https://blog.csdn.net/djstavaV/article/details/127064001