云计算、AI、云原生、大数据等一站式技术学习平台

网站首页 > 教程文章 正文

为什么要使用Qt Designer以及其在Vscode中的配置

jxf315 2025-02-26 12:32:54 教程文章 29 ℃

用PyQt5的一些类创建了一个简单的GUI应用程序,窗体及窗体上的标签对象的创建和属性设置都完全由代码完成。

显然这种纯代码方式构造UI的方式是比较麻烦的,特别是在窗体上组件比较多、层次比较复杂的时候,纯代码方式构造界面的工作量和难度可想而知。


Qt Designer符合MVC(模型—视图—控制器)设计模式,做到了显示和业务逻辑的分离。

Qt Designer具有以下优点:

● 使用简单,通过拖曳和点击就可以完成复杂的界面设计,而且还可以随时预览查看

效果图。

● 转换 Python文件方便。Qt Designer可以将设计好的用户界面保存为.ui文件,其实是

XML 格式的文本文件。为了在 PyQt 中使用.ui 文件,可以通过 pyuic5命令将.ui文件转换

为.py文件件,然后将.py文件引入到自定义的Python代码中。


下面介绍Anaconda+VSCode+QT Designer 配置 PyQt5 环境:

Anaconda 的虚拟环境管理

不同的 python 项目,可能使用了各自不同的 python 的包、模块;

不同的 python 项目,可能使用了相同的 python 的包、模块,但版本不同;

不同的 python 项目,甚至使用的 Python 的版本都是不同;

为了让避免项目所使用的 Python 及包模块版本冲突,所以需要代码运行的依赖环境彼此分开,业内有各种各样的成熟解决方案,但原理都是一样的:不同项目代码的运行,使用保存在不同路径下的 python 和各自的包模块;不同位置的 python 解释器和包模块就称之为虚拟环境,具体关系图如下:

虚拟环境的本质,就是在你电脑里安装了多个 Python 解释器(可执行程序),每个 Python 解释器又关联了很多个包、模块;项目代码在运行时,是使用特定路径下的那个 Python 解释器来执行;


Anaconda中安装PyQt5

安装好Anaconda后打开,在Anaconda里新建一个虚拟环境,命名为vs_conda_envs;

然后点击绿色开关按钮后,弹出窗口后,选择Open Terminal.

在cmd里输入如下指令,安装pyqt5和PyQt5-tools

pip install pyqt5-i https://pypi.tuna.tsinghua.edu.cn/simple
pip install pyqt5-tools -i https://pypi.tuna.tsinghua.edu.cn/simple

Vscode 中配置Anaconda

Vscode 终端默认是 PowerShell 运行 Anaconda 命令会有冲突,导致 Anaconda切换环境无效。需要报 vocode 改为 CMD 命令行运行即可。

ctrl+shift+p 出现命令栏

后输入:

Python:Select Interpreter

然后就能选择想要的虚拟环境了:(选择好环境变量后,才能使用里面的Qt Designer.exe 、PyUic.exe, Pyrcc.exe)


vscode中使用 Qt Designer

在vscode扩展商店搜索 “PYQT Integration” 找到并安装之后就可以使用Qt Designer 设计 UI 界面了;

右键点击已经安装好的PYQT Integration插件后,出现配置窗口,按实际地址情况配置;

PYQT:New Form 创建以. ui 为后缀的 Qt Designer 界面文件:

PYQT:Preview 预览窗口界面效果

PYQT:Edit In Designer 在 Qt Designer 中编辑已创建的. ui 文件

PYQT:Comple Form 编译已创建的. ui 文件(会生成 Ui_xxx.py 文件以便导入到 python代码使用)


总结: 要实现vscode中Qt designer的打开、编辑、转换,则需要以下步骤:

(1)Anaconda虚拟环境环境的配置;

(2)Anaconda在vscode的配置;

(3)Vscode中安装PYQT Integration,并配置;

Tags:

最近发表
标签列表