组件官网:QFluentWidgets – 在设计师中拖拖拽拽,无需书写 QSS,即可快速构建美观的界面
组件介绍
QFluentWidgets 是一个 Qt 组件库,提供了许多更加现代化风格的组件来让你的 Qt 程序界面更加美观,实际上是 Windows 11 的 Fluent Design 风格。
同时支持浅色和深色主题的切换,并且可以做到自动切换与手动切换。
并且内置了 Windows 11 风格的设置卡片,设置的读写都做到了自动化。
快速开始
以一个新项目为例,下面展示如何快速使用该组件库书写一个现代化的程序界面框架。我们默认你已经配置好了 PyCharm Community 并且安装好了项目专用的虚拟环境。
安装
QFluentWidgets 支持 Qt 与 PyQt/PySide,在 Python 中总共有四个分支,分别是 PyQt5/6 与 PySide2/6。
以 PySide6 分支为例,其他分支的安装方法傻瓜一般类似:在 PyCharm Community 中添加清华镜像源的 pypi 并且安装 PySide6,然后搜索安装PySide6-Fluent-Widgets
,即可实现安装。
如果使用命令行的话,就是下面的两行命令:
pip install PySide6 -i https://pypi.tuna.tsinghua.edu.cn/simple
pip install PySide6-Fluent-Widgets -i https://pypi.tuna.tsinghua.edu.cn/simple
使用镜像源的意义在于加速下载,否则对于 PySide 这种程度的包,几乎必然下载失败。
然后,从 Github 上下载一个 Gallery,这里可以可视化查找组件库内置的矢量图标,并且预览各组件的效果。
请注意,我们的目标是上图中的前两个之一。Pro 组件库是需要购买商用许可证才可使用的,Material 组件库是另外一个拟物化风格的组件库,但是食用方法几乎一致。
然后,仍然从这个页面下载 Fluent Designer。
添加外部工具以快速启用 Designer,PySide6-uic 与 Gallery
将 Gallery 和 Fluent Designer 中的程序完整解压到一个安全的地方,然后我们需要添加三个外部工具来方便开发过程中快速调用。
转到上面的外部工具设置页,点击➕,然后依次添加三个工具。
Gallery
程序指向你的 Gallery 所在地,工作目录应当会自动设置。
设置完毕后,在 Pycharm 中的大部分地方单击鼠标右键,在外部工具中选择该工具,将会调出 Gallery。
Fluent Designer
同样。
这里添加的是一个安装了插件的 Designer,可以直接使用 QFluentWidgets 组件进行设计。PySide6 自带的 Designer 只能使用 Qt 默认的组件。
设置完毕后,在 Pycharm 中的大部分地方单击鼠标右键,在外部工具中选择该工具,将会调出 Fluent Designer。
PySide6 UIC
你可能需要查找一下这个程序的位置,它是 PySide6 自带的一个脚本,用于配合 Designer 食用。
- 对于 Virtualenv 环境,请在 PyCharm 项目根目录下的环境 Python 文件夹中的 Scripts 目录下搜索;
- 对于 Conda 环境,请在
你的Windows用户文件夹/.conda/envs/
目录下寻找你的环境 Python 文件夹,再在 Scripts 目录下搜索。
然后,将实参设置为$FileName$ -o $FileNameWithoutExtension$.py
,工作目录设置为$FileDir$
。
现在,在 Pycharm 页面上的项目目录中右键选中一个 ui 文件,选择外部工具中的此工具,选中的 ui 文件将被投喂给这个脚本,然后在同目录下生成一个 py 文件,这就是我们需要的东西。
编写基本代码
假设你已经使用 Designer 随便写好了一个页面,并且转换成了一个 py 文件,直接运行该 py 文件无事发生,你要怎么启动这个程序?
答案是,写一段基本代码。例如说在你的 main.py
中 import
这个 py 文件,你可以如下编码:
from Main_Window import Ui_Main_Window # 这个要看你在 Designer 中编写 ui 时是否有命名,不确定的话可以依靠 Pycharm 的自动补全来写
from PySide6.QtWidgets import QWidget # 你在 Designer 中新建的窗口类型是 QWidget 还是 QMainWindow?是哪个就导入哪个即可
from PySide6.QtWidgets import QApplication # 必须导入,没什么好说的
import sys
class Window(QWidget): # 括号里填入你导入的那个
def __init__(self):
super(Window, self).__init__()
self.ui = Ui_Main_Window() # 等号后面填入你编写的那个
self.ui.setupUi(self)
if __name__ == "__main__":
app = QApplication(sys.argv)
window = Window()
window.show()
sys.exit(app.exec())
这样,你的程序雏形就能通过这个 main.py
入口启动了。
请登录后查看评论内容