抱歉,你查看的文章不存在

Python GUI教程(九):从UI文件中解耦Python代码

本篇概要

  • 通过Qt设计师创建一个GUI
  • 添加数个窗口部件到GUI
  • 转换UI代码为Python代码
  • 创建一个单独的Python模块来控制GUI窗口部件

在之前的文章中,我们适用Qt设计师创建了很多GUI窗口,这些窗口都是界面与逻辑都在一个文件里面。如果GUI程序逻辑简单,倒也没什么问题,如果窗口中部件的逻辑过多,就不便于管理。

在实际的开发中,我们通常将代码分为界面代码和逻辑代码,界面与逻辑分离。下面我们将演示一下在Qt设计师创建的GUI中,解耦逻辑代码。

一、使用Qt设计师创建一个GUI

首先,我们创建一个主窗口:

然后,在主窗口中添加一个Table Widgets表格控件:

在主窗口中添加两个水平布局的按钮:

然后将窗口中的部件进行垂直布局:

基本的结构搭建好了,我们在表格部件中添加行和列:

添加好行和列之后,我们可以在表格控件中右击鼠标,选择“编辑项目”对行和列进行编辑:

这样就完成了窗口界面的布局。

二、将UI文件转为Python文件

我们没有使用Qt设计师进行任何的逻辑性操作,只是创建了一个基本的窗口布局,现在使用pyuic5将其转化为Python文件。

转换成的Python文件运行正常:

三、解耦Python逻辑代码

接下来通过Python模块对UI的主窗口进行逻辑的编辑。

我们新建一个Python文件,引入这个GUI窗口,运行的结果和直接运行那个主文件是一样的。

接着,我们在新建的decouple_window.py文件中对窗口的表格添加默认值:

这样我们就在表格中设置了三个默认数据,现在的设置是直接在主循环中写死的,我们可以新建一个方法,将设置数据的代码放置其中:

除了设置数据,我们还可以为按钮添加一个信号槽,当按钮点击的时候,按钮的文本进行改变:

因为有了逻辑函数,我们的信号槽能够绑定和调用的部件就可以是多种多样的,下面我们就演点击按钮,按钮和表格中的文字都进行改变。

原文发布于微信公众号 - 州的先生(zmister2016)

原文发表时间:2017-11-13

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

编辑于

州的先生

6 篇文章54 人订阅

相关文章

来自专栏前端儿

让 select 的 option 标签支持事件监听(如复制操作)

想自定义option的样式,很多人会建议用 <ul> <li> 标签来辅助同步操作与值

1.2K2
来自专栏程序员同行者

使用autoc js生成文章目录(侧边)导航栏

3302
来自专栏Jerry的SAP技术分享

使用DOM Breakpoints找到修改属性的Javascript代码

使用Chrome开发者工具的DOM断点功能可以让您快速找到修改了某一个DOM元素的Javascript代码。

1969
来自专栏ionic3+

【Appetite】ionic3实录(二)UI分析及总体配置

首先,如果你是初学者,我强力建议你先看完我这篇文章: 【开发指南】(四)Ionic3快速上手并了解这些

1183
来自专栏Jerry的SAP技术分享

如何从ERP下载Sales BOM到CRM

BOM的抬头维护material 1419,在BOM的component部分维护另外两个material 1421和1422。

3547
来自专栏依乐祝

.NET Core实战项目之CMS 第六章 入门篇-Vue的快速入门及其使用

上面文章我给大家介绍了Dapper这个ORM框架的简单使用,大伙会用了嘛!本来今天这篇文章是要讲Vue的快速入门的,原因是想在后面的文章中使用Vue进行这个CM...

1913
来自专栏jiajia_deng

react-router 环境使用锚点的方法

1434
来自专栏前端杂货铺

IE6下的png透明图片的背景定位

在IE6下PNG透明图片做背景,无法使用background-position进行定位。但是可以使用margin和绝对定位来进行。 另外,由于IE6下的 :ho...

3769
来自专栏BestSDK

Mockplus教程:2钟搞定APP首页原型设计,3000个免费素材库

创建项目 ? 打开Mockplus,点击新建项目,选择“手机”项目类型与合适的页面尺寸,点击“确定”即创建成功,是不是不能更简单!无需任何文件创建操作,无需输入...

3225
来自专栏xingoo, 一个梦想做发明家的程序员

在Html中使用Requirejs进行模块化开发

在前端模块化的时候,不仅仅是js需要进行模块化管理,html有时候也需要模块化管理。这里就介绍下如何通过requirejs,实现html代码的模块化开发。 ...

25610

扫码关注云+社区

领取腾讯云代金券