如何使用Eric6和pyqt5写一个四级联动的demo

发布时间：2021-12-03 13:46:36 作者：小新
来源：亿速云阅读：197

# 如何使用Eric6和PyQt5写一个四级联动的Demo

## 一、前言

四级联动是一种常见的UI交互模式，常用于地址选择、分类导航等场景。本文将详细介绍如何使用Eric6（Python IDE）和PyQt5实现一个包含省、市、区、街道四级联动的Demo程序。通过这个案例，您将掌握：

1. Eric6的基本使用方法
2. PyQt5的信号槽机制
3. 多级联动控件的实现原理

## 二、环境准备

### 1. 安装必要工具
```bash
pip install PyQt5 eric6

2. 启动Eric6

安装完成后，在终端执行：

eric6

三、创建项目

点击”Project” → “New”
输入项目名称（如”FourLevelLinkage”）
选择Python解释器路径

四、界面设计

1. 新建Qt窗体

右键项目 → “New” → “Qt GUI Form”

选择”Dialog without Buttons”模板，命名为linkage_dialog.ui

2. 添加控件

在Qt Designer中： - 添加4个QComboBox控件，分别命名为： - province_combo - city_combo - district_combo - street_combo - 添加一个QVBoxLayout布局 - 添加说明标签

最终界面结构：

<ui>
  <class>LinkageDialog</class>
  <widget class="QDialog" name="LinkageDialog">
    <layout class="QVBoxLayout">
      <item>
        <widget class="QLabel" name="label">
          <text>四级联动演示：</text>
        </widget>
      </item>
      <item>
        <widget class="QComboBox" name="province_combo"/>
      </item>
      <item>
        <widget class="QComboBox" name="city_combo"/>
      </item>
      <item>
        <widget class="QComboBox" name="district_combo"/>
      </item>
      <item>
        <widget class="QComboBox" name="street_combo"/>
      </item>
    </layout>
  </widget>
</ui>

五、逻辑实现

1. 生成Python代码

在Eric6中： 1. 右键linkage_dialog.ui → “Compile Form” 2. 生成ui_linkage_dialog.py

2. 创建主程序文件

新建main.py，代码如下：

import sys
from PyQt5.QtWidgets import QApplication, QDialog
from ui_linkage_dialog import Ui_LinkageDialog

class LinkageDemo(QDialog, Ui_LinkageDialog):
    def __init__(self):
        super().__init__()
        self.setupUi(self)
        
        # 初始化数据
        self.data = {
            "江苏省": {
                "南京市": {
                    "玄武区": ["新街口街道", "梅园街道"],
                    "鼓楼区": ["宁海路街道", "湖南路街道"]
                },
                "苏州市": {
                    "姑苏区": ["观前街道", "平江街道"],
                    "工业园区": ["娄葑街道", "斜塘街道"]
                }
            },
            "浙江省": {
                "杭州市": {
                    "西湖区": ["灵隐街道", "文新街道"],
                    "余杭区": ["仓前街道", "五常街道"]
                }
            }
        }
        
        # 初始化信号连接
        self.province_combo.currentTextChanged.connect(self.update_cities)
        self.city_combo.currentTextChanged.connect(self.update_districts)
        self.district_combo.currentTextChanged.connect(self.update_streets)
        
        # 加载省份数据
        self.load_provinces()
    
    def load_provinces(self):
        self.province_combo.clear()
        self.province_combo.addItems(self.data.keys())
    
    def update_cities(self, province):
        self.city_combo.clear()
        if province in self.data:
            self.city_combo.addItems(self.data[province].keys())
    
    def update_districts(self, city):
        self.district_combo.clear()
        province = self.province_combo.currentText()
        if province and city in self.data[province]:
            self.district_combo.addItems(self.data[province][city].keys())
    
    def update_streets(self, district):
        self.street_combo.clear()
        province = self.province_combo.currentText()
        city = self.city_combo.currentText()
        if province and city and district in self.data[province][city]:
            self.street_combo.addItems(self.data[province][city][district])

if __name__ == "__main__":
    app = QApplication(sys.argv)
    demo = LinkageDemo()
    demo.show()
    sys.exit(app.exec_())

六、关键点解析

1. 数据结构设计

使用嵌套字典存储四级数据：

{
    "省": {
        "市": {
            "区": ["街道1", "街道2"],
            ...
        },
        ...
    },
    ...
}

2. 信号槽机制

currentTextChanged信号在选项变化时触发
上级控件变化时清空并更新下级控件

3. 数据联动流程

省份变化 → 更新城市列表 → 触发城市变化 → 更新区列表 → 触发区变化 → 更新街道列表

七、运行测试

点击Eric6工具栏中的”Run”按钮
测试不同选择组合是否正常联动
验证边界情况（如无数据时是否清空）

八、扩展建议

从数据库加载真实地址数据
添加数据验证功能
实现多选模式
增加搜索过滤功能

九、总结

通过本Demo，我们实现了： - 使用Eric6快速开发PyQt5应用 - 多级联动的核心逻辑 - PyQt5信号槽的实际应用

完整代码已包含所有关键实现，您可以直接运行或在此基础上进行扩展开发。 “`