【PyQt5】(02)Qt Designer:快速设计GUI界面的利器

您所在的位置:网站首页 qt进度条对话框 【PyQt5】(02)Qt Designer:快速设计GUI界面的利器

【PyQt5】(02)Qt Designer:快速设计GUI界面的利器

2023-06-09 18:07| 来源: 网络整理| 查看: 265

Qt for Python

系列文章目录

【PyQt5】(01)PyQt的详细介绍

文章目录 系列文章目录前言一、安装Qt Designer二、Qt Designer的基本用法2.1 新建窗体2.2 添加部件2.3 编辑属性2.4 布局管理2.5 设置样式2.6 保存文件 三、将UI文件转化为Python代码并显示3.1 使用uic将UI文件转换为Python代码3.2 创建对话框实例并显示UI 总结

前言

  Python Qt Designer 是一个图形界面设计工具,用于创建Qt应用程序的用户界面。它支持创建典型的窗口和对话框,并允许使用各种小部件(widget)和布局管理器(layout manager)。   Qt Designer是一个可视化编辑器,用户可以使用它在GUI界面中定义控件和布局,并将其保存为.ui文件。

本文将详细介绍 Python Qt Designer 的使用方法。

一、安装Qt Designer

  Python Qt Designer 可以通过 PyQt5 软件包进行安装。请运行以下命令:

pip install pyqt5-tools

  安装成功后,可以通过命令行启动 Python Qt Designer:

designer

Qt Designer

  如果你使用的Pycharm开发环境,可以在 Pycharm 中安装 PyQt5 工具箱(PyQt5 Tools)可以获得 Qt Designer、PyUIC 和 Pyrcc。

  在 PyCharm 中安装 Qt Designer、PyUIC 和 Pyrcc 可以通过以下步骤完成:

1. 安装 PyQt5 工具包

首先需要安装 PyQt5 工具包,可以通过以下命令行在 PyCharm 中安装:

pip install pyqt5

  如果已经安装了 PyQt5 但是没有安装 Qt Designer、PyUIC 或 Pyrcc,则需要使用以下命令行安装:

pip install pyqt5-tools

2. 将 Qt Designer 添加到 PyCharm

  打开 PyCharm,选择 “File->Settings”,在左侧面板中选择 “Tools->External Tools”,然后单击右侧面板中的 “+” 按钮。 Pycharm ExternalTools

  在弹出的对话框中,在"Name"字段中输入 “Qt Designer”,在 “Description” 字段中输入 “PyQt5 Qt Designer”,在 “Program” 字段中输入 Qt Designer 的安装路径,其他的如下图所示: pycharm add PyQt5 Qt Designer 然后,单击 “OK” 按钮保存设置。

3. 添加 PyUIC 工具

  PyUIC是一种Python GUI应用程序的用户界面代码生成器,可以将Qt Designer UI文件生成Python源代码。PyUIC生成的Python代码是基于Qt的PyQt和PySide库。它可以方便地与其他Python库集成,如numpy、matplotlib等。PyUIC生成的代码易于阅读和修改,可以方便地定制应用程序的用户界面。   与添加 Qt Designer 类似,可以将 PyUIC 工具添加到 PyCharm 中。在 “External Tools” 对话框中单击 “+” 按钮,然后输入以下信息: pycharm add PyUIC

实参输入以下内容: -m PyQt5.uic.pyuic $FileName$ -o $FileNameWithoutExtension$.py 意思将选中的 xxx.ui 文件转换为同名的 xxx.py文件 需要特别注意的是,执行的时候需要右键选中对应的 xxx.ui 文件,不然会出错的。

3. 添加 Pyrcc 工具

  Pyrcc是一个命令行实用程序,用于将Qt Designer中创建的.qrc文件转换为.py文件。 Pyrcc是Qt开发者的常见工具,因为.qrc文件与Python程序捆绑在一起,例如Qt资源文件,通过PyQt5或PySide2模块在Python脚本中的访问方式。   与添加 Qt Designer 类似,可以将Pyrcc 工具添加到 PyCharm 中。在 “External Tools” 对话框中单击 “+” 按钮,然后输入以下信息:

在这里插入图片描述)

保存设置后,可以在 PyCharm 中使用这些工具了。只需要右键单击任何 .ui、.qrc 或 .ui 文件,然后选择 “External Tools” 菜单,单击 “Qt Designer”、“PyUIC” 或 “Pyrcc” 即可。 在这里插入图片描述

二、Qt Designer的基本用法 2.1 新建窗体

  启动Qt Designer后,可以通过文件(File) -> 新建(New) 或使用快捷键Ctrl + N来创建新的UI文件。在弹出的对话框中选择需要使用的类别(如“Dialog”、“Main Window”等),并选择需要使用的模板(如“Empty”, “Grid”, “Dock Widget”等)。然后点击创建(R)按钮即可创建一个新的UI文件。

New forms dialog of Qt Designer

在新建窗体对话框中,你可以选择创建的窗口类型,主要介绍如下几种:

Dialog:创建一个对话框窗口,此窗口通常用于显示相对较少的信息或与用户交互。 MainWindow:创建一个主窗口窗口,此窗口通常用于显示大量信息和多种不同的功能。Widget:创建一个普通的窗口控件,此窗口通常只是用来显示信息或数据。DockWidget:创建一个浮动窗口控件,此窗口通常用于显示常用的工具或者选项,并且可以随时移动或关闭。ToolBar:创建一个工具栏窗口控件,此窗口可以包含多个工具按钮,以方便用户进行操作和导航。 2.2 添加部件

在左侧的“Widget Box”中,可以找到各种类型的控件,比如按钮、文本框、标签、下拉菜单、复选框、单选按钮和进度条等。可以通过拖动控件到窗口中添加。

2.3 编辑属性

在窗口中添加控件后,可以通过“Property Editor”编辑控件的属性。例如,可以更改控件的大小、位置、文本内容、颜色、字体等。

2.4 布局管理

在添加控件时,需要考虑控件的位置和大小。布局管理器可以帮助我们在窗口内按照一定的方式排列控件,使窗口更加美观。Qt Designer提供了以下几种类型的布局管理器:

QVBoxLayout:垂直布局。

QHBoxLayout:水平布局。

QGridLayout:网格布局。

QFormLayout:表单布局。

QStackedLayout:层叠布局。

2.5 设置样式

可以通过“Style Sheet Editor”设置窗口和控件的样式。例如,可以设置控件的背景色、前景色、边框样式等。

2.6 保存文件

最后将窗口保存为.ui文件,可以在“File”菜单中选择“Save”或使用快捷键Ctrl+S。.ui文件是一个XML文件,包含了窗口和控件的布局、属性、事件以及信号槽等信息。

三、将UI文件转化为Python代码并显示

Qt Designer设计好的UI文件可以通过PyQt或PySide中的uic模块将其转换为Python代码,从而使其可以在Python程序中使用。下面介绍一下具体的步骤。 在这里插入图片描述

3.1 使用uic将UI文件转换为Python代码

在 PyCharm 中只需要右键单击.ui文件(test_dialig .ui),然后选择 “External Tools” 菜单,单击PyUIC即可。

使用uic将UI文件转换为Python代码

在Python程序中使用如下代码可以将UI文件转换为Python代码:

class Ui_Dialog(object): def setupUi(self, Dialog): Dialog.setObjectName("Dialog") Dialog.resize(400, 300) self.label = QtWidgets.QLabel(Dialog) self.label.setGeometry(QtCore.QRect(50, 100, 291, 31)) font = QtGui.QFont() font.setFamily("Arial") font.setPointSize(20) self.label.setFont(font) self.label.setObjectName("label") self.retranslateUi(Dialog) QtCore.QMetaObject.connectSlotsByName(Dialog) def retranslateUi(self, Dialog): _translate = QtCore.QCoreApplication.translate Dialog.setWindowTitle(_translate("Dialog", "test_dialog")) self.label.setText(_translate("Dialog", "这是一个测试对话框")) 3.2 创建对话框实例并显示UI

运行Python程序后,UI界面就会显示出来,用户即可使用UI界面中的各种控件。

import sys from PyQt5.QtWidgets import QApplication, QDialog from test_dialog import Ui_Dialog # 导入对话框类 class MyDialog(QDialog): def __init__(self): super().__init__() # 实例化对话框类 self.ui = Ui_Dialog() self.ui.setupUi(self) if __name__ == '__main__': app = QApplication(sys.argv) dialog = MyDialog() dialog.show() sys.exit(app.exec_())

在上面的代码中,我们导入了PyQt5中的QApplication和QDialog类,并从我们生成的Python代码文件中导入了对话框类。

然后,我们创建一个MyDialog类,继承自QDialog,并在构造函数中实例化对话框类。最后,我们创建一个应用程序(QApplication),实例化MyDialog类,调用show()方法来显示对话框,并启动应用程序的事件循环。

运行上面的代码,就可以显示由Qt Designer生成的对话框了。

test dialog

总结

Python Qt Designer 是一个强大的图形界面设计工具。它提供了用户友好的界面来创建和编辑窗口和小部件,并帮助用户使用布局管理器自动排列它们。使用 PyQt5,可以将 .ui 文件加载为 Python 应用程序的主窗口,并通过各种控件来交互。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3