PyQt5桌面应用开发（4）：界面设计

原创

已于 2024-07-23 08:17:04 修改 · 8.6k 阅读

115 ·

CC 4.0 BY-SA版权

文章标签：

#qt #python #开发语言 #pyqt5 #界面设计

于 2023-03-23 19:49:30 首次发布

本文详细介绍了PyQt5用于桌面应用开发的界面设计，包括需求分析的重要性、界面设计元素的分类，如布局、按钮、数据视图等，并提供了将.ui文件转化为Python代码的方法。文章通过实例展示了如何使用Designer工具和不同的方式集成界面到应用程序中，强调了根据用户需求和交互设计界面的原则。

本文目录

PyQt5桌面应用系列
前言
为什么又是需求分析？
PyQt5的界面设计元素
- 界面设计元素分类
编译为Python代码使用
总结

PyQt5桌面应用系列

前言

经过需求分析、事件循环和并行设计的介绍，终于还是要写一篇界面设计的内容。很不情愿，因为我这个部分很不擅长，设计的界面很丑很丑。

其实丑并不可怕，关了灯都一样……

首先，我们再回到需求分析的话题。

为什么又是需求分析？

需求分析，这条内裤，始终是要穿上的。

那么界面设计的内裤大概是什么样的呢，有很多人是从美观的角度出发设计出漂亮的界面。我们搬砖的找了一堆支持的理论，还是只能设计出巨丑的界面。一般而言，我们是从用户体验的角度出发，结合软件需求分析的过程来确定界面。
用户体验设计的蜂巢模型
从用户需求这里，基本上就能确定数据报表，从功能需求分析这里，就能确定用户交互。这两个部分最终构成用户界面的开发需求。

报表界面；
交互界面。

软件用户界面设计的分析过程
等到报表界面和交互界面确定后，就是利用PyQt5提供的工具来实现。

PyQt5的界面设计元素

在采用PyQt5设计界面时，我们常用和标准的工具就是Designer。如何安装和使用Designer，我实在不耐烦讲。网上教程（视频）和参考貌似比较多。就只是在优快云上，就一大堆，优快云搜索pyqt5 designer即可。如果英语好，也有更多参考内容，随便举个栗子。我就大概拉一拉界面设计元素，以作参考。

界面设计元素分类

在Designer里面，PyQt5的界面设计元素分为8个大类：

Layouts：界面布局
Spacers：空间间隔
Buttons：动作按钮
Item Views：数据视图
Item Widgets：数据控件
Containers：空间容器
Input Widgets：输入控件
Display Widgets：显示控件

直接使用的话，就大概是按照这这八类来布置。这个分类，基本上是按照控件的功能来分的。使用的时候，我们还应该根据前面所讲的开发需求来进行进一步的分类。
PyQt的UI设计元素
所以我们的分类是这样的：
a.报表功能类（共18个控件）
b.输入功能类（共22个控件）
c.布局功能类（共16个控件）

控件功能分类
各个具体的控件功能，已经一些教程进行详细的指导。

编译为Python代码使用

转换命令行

我们很随意的假设要展示三组数据（报表1：树表列），然后用Designer画了一个控件。

在这里插入图片描述
然后很随意的存成文件tree_data_view.ui，用下面的命令，就可以把界面文件转化成Python文件。这里增加一个参数-x，就给输出的文件增加一个运行的例子。

pyuic5 .\tree_data_view.ui -o .\tree_data_view.py -x

接下来就能运行，显示界面示例。

python .\tree_data_view.ui -o .\tree_data_view.py -x

在这里插入图片描述
跟我们在Designer里面画的界面一模一样。ui文件的源代码也很简单，很容易看懂。

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>Form</class>
 <widget class="QWidget" name="Form">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>1106</width>
    <height>584</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Item Widgets Demo</string>
  </