- 什么是 Qt Designer？ (简介)
- 环境准备 (安装所需工具)
- Qt Designer 基础操作 (创建、拖拽、布局、设置属性)
- 核心步骤：将
.ui文件转换为 Python 代码 - 在 Python 中加载和使用 UI 文件 (两种主要方法)
- 一个完整的实战示例 (从设计到运行)
- 高级技巧与最佳实践
什么是 Qt Designer？
Qt Designer 是一个独立的可视化 GUI 设计工具，由 Qt 公司提供,它允许你：
（图片来源网络，侵删）
- 拖拽设计：通过从组件箱（Widget Box）中拖拽控件（如按钮、标签、输入框等）到窗体上来构建界面。
- 所见即所得：实时预览你的界面设计。
- 管理布局：轻松管理控件的布局,使界面在不同窗口大小下都能保持美观。
- 设置样式：可以设置控件的样式表，实现类似网页 CSS 的效果。
它会生成一个 .ui 文件（一个 XML 文件），这个文件描述了你的界面布局和所有控件的属性，你的 Python 代码需要读取这个 .ui 文件,并将其显示出来。
环境准备
你需要安装以下两个主要包：
- PyQt5 或 PyQt6：这是 Python 的 Qt 绑定库，让你能在 Python 中使用 Qt 的功能。
- PyQt5-tools 或 PyQt6-tools：这个包包含了我们今天的主角——Qt Designer 的可执行文件，以及一个用于将
.ui文件转换为.py文件的工具 (pyuic5或pyuic6)。
推荐使用 pip 安装：
# 如果你使用 PyQt5 pip install PyQt5 PyQt5-tools # 如果你使用 PyQt6 pip install PyQt6 PyQt6-tools
如何启动 Qt Designer？
（图片来源网络，侵删）
安装完成后，Qt Designer 的启动方式可能因操作系统而异：
- Windows: 在开始菜单中搜索 "Qt Designer"。
- macOS: 通常会安装到
/Applications/Qt/目录下。 - Linux (使用 pip 安装): 你可能需要从终端启动，命令通常是
designer，如果找不到，可以尝试pyqt5-tools designer或pyqt6-tools designer。
Qt Designer 基础操作
打开 Qt Designer 后，你会看到一个启动对话框，选择 "Main Window" 然后点击 "Create",我们就从最经典的窗口开始。
主要界面区域：
- 主窗口: 你正在设计的界面。
- 组件箱: 包含了所有可用的 Qt 控件，如按钮、标签、文本框、滑块等,你可以直接拖拽到主窗口上。
- 属性编辑器: 选中任何一个控件或窗体后，这里会显示其所有属性，如
objectName(对象名，非常重要！)、text(显示文本)、geometry(位置和大小) 等,你可以在这里修改它们。 - 对象检查器: 以树状结构显示窗体上的所有对象及其层级关系。
- 布局工具: 这是保证界面自适应的关键。
关键操作：
（图片来源网络，侵删）
- 添加控件: 从组件箱拖拽到主窗口。
- 设置对象名: 在属性编辑器中找到
objectName。强烈建议为每个控件设置一个独一无二且易于识别的名字，pushButton_start,label_status,lineEdit_input，这在你写 Python 代码时至关重要。 - 使用布局:
- 水平布局：让控件在同一行水平排列。
- 垂直布局：让控件在同一列垂直排列。
- 网格布局：让控件按网格排列。
- 使用布局是专业 GUI 开发的核心，不要手动设置每个控件的位置和大小，而是先将控件放入一个布局管理器中，选中多个控件或一个容器,然后点击布局工具栏上的相应按钮即可。
- 设置主窗口属性: 点击主窗口的空白处，在属性编辑器中可以修改窗口标题 (
windowTitle)、大小 (size)、图标 (windowIcon) 等。
核心步骤：将 .ui 文件转换为 Python 代码
Qt Designer 设计的 .ui 文件是 XML 格式的，Python 无法直接执行它，我们需要将其转换为 Python 代码。
使用 pyuic 命令行工具 (推荐)
假设你设计的界面文件保存为 my_ui.ui。
-
打开你的命令行终端（CMD, PowerShell, Terminal 等）。
-
运行以下命令：
# 对于 PyQt5 pyuic5 -x my_ui.ui -o my_ui.py # 对于 PyQt6 pyuic6 -x my_ui.ui -o my_ui.py
-x或--export-all: 这是一个有用的选项，它会生成一个可以直接运行的、包含if __name__ == "__main__":主程序的代码文件，如果不加-x，则只生成 UI 类的定义。-o或--output: 指定输出的 Python 文件名。
-
执行后，你会得到一个
my_ui.py文件，这个文件里包含了将你的 UI 描述成 Python 类的代码。
在 PyCharm/VS Code 等 IDE 中配置
很多 IDE 允许你右键 .ui 文件并选择 "Compile" 或类似选项，背后调用的也是 pyuic 命令。
在 Python 中加载和使用 UI 文件
现在你有了一个 my_ui.py 文件，接下来就是如何在你自己的 Python 程序中使用它,主要有两种主流方法。
直接导入生成的 .py 文件 (简单直接)
这种方法最简单,适合小型项目或快速原型。
my_ui.py (由 pyuic 生成)
# ... (这是 pyuic 生成的长篇代码) ...
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
# ... (这里是所有 UI 控件的创建和布局代码) ...
self.retranslateUi(MainWindow)
# ... (其他辅助函数) ...
main.py (你的主程序)
import sys
from PyQt5.QtWidgets import QApplication, QMainWindow
# 导入我们刚刚生成的 UI 类
from my_ui import Ui_MainWindow
class MyMainWindow(QMainWindow):
def __init__(self):
super().__init__()
# 实例化 UI 类
self.ui = Ui_MainWindow()
# 调用 setupUi 方法来构建界面
self.ui.setupUi(self)
# --- 在这里添加你的逻辑代码 ---
# 连接按钮的点击事件
self.ui.pushButton_start.clicked.connect(self.on_button_click)
# ---------------------------------
def on_button_click(self):
# 获取 line_edit 的文本
text = self.ui.lineEdit_input.text()
# 在 label 上显示
self.ui.label_status.setText(f"你好, {text}!")
if __name__ == "__main__":
app = QApplication(sys.argv)
window = MyMainWindow()
window.show()
sys.exit(app.exec_())
优点：
- 非常简单，逻辑和 UI 混在一起。
- 调试方便，可以直接在
my_ui.py中看到所有控件。
缺点：
- 每次修改 UI 后，都必须重新运行
pyuic命令，否则你的 Python 代码不会更新。 - UI 代码和业务逻辑代码耦合在一起,不利于大型项目的维护。
使用 uic 模块加载 .ui 文件 (更推荐，解耦)
这是更专业、更灵活的方法，它将 UI 文件作为资源加载，而不是将其编译为 Python 代码。
main.py (你的主程序)
import sys
from PyQt5.QtWidgets import QApplication, QMainWindow
from PyQt5 import uic # 导入 uic 模块
class MyMainWindow(QMainWindow):
def __init__(self):
super().__init__()
# 使用 uic.loadUi 直接加载 .ui 文件
# 这会返回一个 Python 对象，我们将其赋值给 self.ui
self.ui = uic.loadUi("my_ui.ui", self)
# --- 在这里添加你的逻辑代码 ---
# 连接按钮的点击事件
self.ui.pushButton_start.clicked.connect(self.on_button_click)
# ---------------------------------
def on_button_click(self):
# 获取 line_edit 的文本
text = self.ui.lineEdit_input.text()
# 在 label 上显示
self.ui.label_status.setText(f"你好, {text}!")
if __name__ == "__main__":
app = QApplication(sys.argv)
window = MyMainWindow()
window.show()
sys.exit(app.exec_())
优点：
- 完全解耦：UI 文件 (
.ui) 和业务逻辑代码 (.py) 是分离的，设计师可以修改.ui文件，而你不需要重新编译 Python 代码。 - 开发流程更顺畅：修改 UI -> 保存
.ui文件 -> 运行 Python 程序,无需手动执行转换命令。 - 项目结构更清晰。
缺点：
- 需要将
.ui文件和你的 Python 脚本放在同一个目录,或者正确指定其路径。
强烈推荐使用方法二进行开发。
一个完整的实战示例
-
设计界面:
- 打开 Qt Designer，创建一个
Main Window。 - 添加一个
Vertical Layout。 - 在布局中添加一个
Label，objectName设为label_title，text设为 "欢迎使用我的应用"。 - 添加一个
Line Edit，objectName设为lineEdit_name。 - 添加一个
Push Button，objectName设为button_greet，text设为 "问好"。 - 保存文件为
greeting_app.ui。
- 打开 Qt Designer，创建一个
-
编写 Python 代码:
- 创建一个
main.py文件，内容如下（使用方法二）：import sys from PyQt5.QtWidgets import QApplication, QMainWindow, QMessageBox from PyQt5 import uic
class GreetingApp(QMainWindow): def init(self): super().init()
加载 UI 文件
self.ui = uic.loadUi("greeting_app.ui", self) # 连接信号和槽 self.ui.button_greet.clicked.connect(self.greet_user) def greet_user(self): """当按钮被点击时调用此函数""" name = self.ui.lineEdit_name.text() if name: QMessageBox.information(self, "问候", f"你好, {name}!") else: QMessageBox.warning(self, "警告", "请先输入你的名字！")if name == "main": app = QApplication(sys.argv) window = GreetingApp() window.show() sys.exit(app.exec_())
- 创建一个
-
运行程序:
- 确保你的目录下有
greeting_app.ui和main.py。 - 在终端中运行
python main.py。 - 你将看到一个窗口，输入名字后点击按钮,会弹出一个对话框。
- 确保你的目录下有
高级技巧与最佳实践
- 使用资源文件 (.qrc): 如果你的应用需要包含图片、图标等文件，可以使用 Qt 的资源系统。
- 创建一个
.qrc文件（XML 格式）,列出你的资源文件。 - 使用
pyrcc5或pyrcc6命令将其转换为_rc.py文件。 - 在你的 Python 代码中导入这个
_rc.py文件，然后就可以通过icon_name的方式来使用资源了。
- 创建一个
- 使用
pyqtSlot装饰器: 对于更复杂的信号，或者需要传递额外参数，可以使用@pyqtSlot(...)装饰器来明确定义槽函数的参数类型。 - 将 UI 文件打包: 在使用
pyinstaller等工具将你的 Python 程序打包成.exe时，一定要确保.ui文件被包含进去，你可以在.spec文件中添加datas = [('greeting_app.ui', '.')]来实现。 - 版本控制: 将
.ui文件和你的 Python 代码一起提交到 Git 等版本控制系统中，这样可以方便地追踪 UI 的变更历史。
希望这份详细的教程能帮助你快速上手 Python Qt Designer！
