淘先锋技术网

首页 1 2 3 4 5 6 7

使用eric5集成环境写qt gui程序_huadingjin_新浪博客

Posted By: agon,  Published:February 17th, 2013   【Updated:October 13th, 2013】

Python的qyqt结合Qt designer，自定义slot的时候总是要手动连接和自定义函数，而且要手动转ui文件，很麻烦，幸好有一款叫eric的ide，整合了qt designer，可以使python像在qt creater下一样使用Qt designer。下面讲解一个利用此集成环境做的一个最简单gui程序。

本文假设你曾经在非集成环境下用pyuic4生成过python脚本，没有也没关系，照着做就行了，推荐阅读一下Introduction to Python Programming and Developing GUI Applications with PyQT里的第七章PyQT（下载）。

本文十分基础，而且有点罗嗦，请高手飘过，新手选读。

准备工作：

安装最新版的python

本文为3.3版

安装最新版的pyqt

本文版本为4.9.6-1，安装位置在python目录

安装最新版qt

本文为版本5.01，安装文件800多MB，安装需要4G左右安装空间，请留足空间。安装路径自定义就可以了，其余默认

安装eric5

a.到下载页面点击Download eric5 到下载页面，找到最新版本，本文使用的是5.3，如果不想使用英文版，可以同时下载中文包
b.解压文件，到解压目录，运行install.py，完成安装
c.命令行下输入eric5或者在安装目录下双击eric5.pyw（可能会有cmd窗口，右键属性，默认打开方式选择python安装目录下的pythonw.exe），就能打开eric5

配置

初次打开，提示初始化设置，本文只涉及基本的简单设置，具体个性化设置，以后更改可以在Settings > Preferences下更改，请参考官方文档。
1.点击Eidtor>APIs，勾选Compile APIs automatically，在Language下拉菜单下选择Python3，点击Add from installed APIs，选择你需要的APIs。最后点击Compile APIs，等待几分钟，编译完后点Apply。


图2.1
2.点击Eidtor>Autocompletion，勾选所有选项，点击Eidtor>AutocompletionQ>Scintilla，选from Document and API files，Apply。
3.点击确定

第一个程序

创建新project

打开eric5，点击Project > new，跳出一个对话框, 在这儿你可以设置一些project属性，这里面主要涉及的是项目名称（这里命名为Welcome）和目录位置（自定义）。

图3.1
点击确定，然后蹦出一个对话框，是否添加已经存在的python，这里选择否。

创建form

a.在左侧的project viewe里，点击左上角的form选项卡，在空白区域右键，选择New form。

图3.2
b.我们使用QtDesigner设计程序界面，在跳出的对话框里选择Dialog，然后点击OK。然后在保存对话框里选择新建文件夹，命名为ui（另一种创建文件夹的方法是在source选项里，右键 > new package）。进入ui文件夹，保存为Welcome.ui。此时form项里已经出现我们刚才创建的Welcome.ui文件。

图3.3
c.在创建ui文件的同时，会自动打开QtDesigner，你也可以在form选项里双击Welcome.ui来打开QtDesigner。按照下图创建程序界面

图3.4

创建预定义的连接

Signals/Slots。点击QtDesigner工具栏上的Edit Signals/Slots（F4），进入编辑模式，鼠标放到clear按钮上方，按钮变红，按住鼠标向上拖动到文本框，松开鼠标，跳出连接设置对话框。按下图选择对应的选项，确定。

图3.5
便在按钮和文本框之间创建连接，当按钮被点击发出clicked()信号，文本框接收信号，调动clear()槽（slot）方法，清空文本框里的文字。你可以按下Ctrl+R组合键，来调出一个实例，在文本框里输入文字，然后点击clear。
点击保存，关闭QtDesigner。

编译与运行程序

a.回到eric5的form选项卡里，右键Welcome.ui，点击Compile form。这将.ui文件（实际为xml）当做输入文件生成对应的python代码文件（Ui_welcome.py）。在Project viewer里的sources选项卡里可以看到，这个文件里包含一个Ui_Dialog类，我们创建的界面元素及信号与槽的连接，都通过这个类创建。
b.我们还要新建一个文件来调用UI_Dialog执行程序。我们在sources选项卡里的根目录下，右键，选择add source files，在source Files(在打开对话框里右键新建文件,显示所有后缀,重命名)里新建一个callWelcome.py勾选Is sourcecode files。

图3.6
c.在callWelcome.py里添加以下代码（本文不解释代码含义，推荐阅读本节开头介绍的图书章节）：

  1. import sys
  2.  
  3. from ui.Ui_welcome import * #调用界面python代码
  4.  
  5. class MyForm(QtGui.QDialog):
  6.  
  7.     def __init__(self, parent=None):
  8.  
  9.         QtGui.QWidget.__init__(self, parent)
  10.  
  11.         self.ui = Ui_Dialog()
  12.  
  13.         self.ui.setupUi(self)
  14.  
  15. if __name__ == "__main__":
  16.  
  17.     app = QtGui.QApplication(sys.argv)
  18.  
  19.     myapp = MyForm()
  20.  
  21.     myapp.show()
  22.  
  23.     sys.exit(app.exec_())

d.保存后，点击菜单Project > Properties，在main script 选项里选择callWelcome.py为main script，确定。
e.在菜单里选择Start > Run project。蹦出一个对话框，按下图修改

图3.7
f.点击确定，蹦出程序界面。我们的第一个程序完成。

修改第一个程序

第一个程序完成，显然它和我们的程序名weilcome不符，我们要做的程序是点击button会显示hello+文本框里的名字。但是预定义里没有这样的slot（槽）方法，这就需要我们自定义一个slot。一般的方法是在callWelcome.py里的MyForm类里自定义一个方法，再用QtCore.QObject.connect来连接。记住不能写在通过ui文件自动生成的py文件里，如果那样做的话，下次修改界面重新生成时，会覆盖之前自己写的方法。用这个方法有一点烦人，每次自定义slot方法，都要手动定义方法，写连接命令，而且库名字很容易打错，用eric5的目的就是省去这些步骤，直接写方法，把精力用在自定义方法的内容上。

准备工作

保存project，然后关闭。因为没用版本控制，用原始的方法，把welcome的project文件夹复制出来一份，另存为，重名为welcome2。打开eric5，在菜单栏选择project > open，打开welcome2文件夹里的Welcome.e4p。点击菜单Project > Properties，在project 选项里把路径里的welcome改为welcome2。
或者直接忽略上面一段话。

修改界面

a.在左侧的project viewe里，点击左上角的form选项卡，双击welcome.ui，打开QtDesigner。
b.按照下图添加pushButton和label：

图4.1
对象的文字删掉后在界面上就看不到了，它还存在着，在对象查看器里依然可以看到。
c.回到eric5的form选项卡里，右键Welcome.ui，点击Compile form。
每次修改完界面，都要重新compile。

创建自定义slot

a.下面就到本文重点了，为了让我们自定义的方法不被ui-complier自动生成的类覆盖，我们要创建一个文件，里面包含一个自定义的类，并且这个类继承ui文件自动生成的类。Eric5使这一切都很方便：
①右键welcome.ui，选择Generate dialog code。此时弹出一个对话框，如下图：


图4.2
②点击new，跳出一个对话框，如下图

图4.3
图里的文本是自动生成的，因为我们创建的界面是Dialog，所以类名是Dialog，文件名welcome.py，根据ui名生成，这里都可以自定义，我们用默认的。点击确定，回到刚才的对话框。
③在filter with下方，我们会看到所有在QtDesigner里创建的对象，以及它们预定义的方法。我们只需要hello这个button click事件，来触发自定义的slot。按照下图选择，然后确定。


图4.4
3.在source选项卡里我们就能看到eric5生成的welcome.py。双击在编辑器里打开，找到如下代码：
<</p>

  1.     @pyqtSlot()
  2.  
  3.     def on_buttonHello_clicked(self):
  4.  
  5.         """
  6.  
  7.         Slot documentation goes here.
  8.  
  9.         """
  10.  
  11.         # TODO: not implemented yet
  12.  
  13.         raise NotImplementedError

把raise NotImplementedError，修改为自定义的代码，修改代码如下：

  1.     @pyqtSlot()
  2.  
  3.     def on_buttonHello_clicked(self):
  4.  
  5.         """
  6.  
  7.         Slot documentation goes here.
  8.  
  9.         """
  10.  
  11.         #当点击hello button的时候，把labelMessage的text改为lineUserNam里的文字
  12.  
  13.         self.labelMessage.setText("Hello " + self.lineUserNam.text())

修改main scrpt运行程序

a.因为我们不从生成的UI_welcome.py生成程序界面，而是通过welcome.py里继承的Dialog类，所以要改一下callWelcome.py这个文件，更改如下：

  1. import sys
  2.  
  3. from PyQt4.QtGui import QApplication #添加
  4.  
  5. from ui.welcome import * #这里有修改
  6.  
  7.  
  8.  
  9. if __name__ == "__main__":
  10.  
  11.     app = QApplication(sys.argv) #修改
  12.  
  13.     myapp = Dialog()
  14.  
  15.     myapp.show()
  16.  
  17. sys.exit(app.exec_())

b.在菜单里选择Start > Run project。蹦出对话框，确保directory位置和在当前project存放位置一样。

在文本框内输入world，点击hello，显示hello world。

完毕，容易错地地方：

  1. 自定义方法里的对象名打错，和ui里的不一样。
  2. 每次修改完ui，都要点compile
  3. 运行时确定main script和 project目录正确

好长时间没写博客,用word写完,去掉垃圾代码,粘过来还是乱七八糟,word文章下载地址

文章参考：

网址：

官方教程：http://eric-ide.python-projects.org/eric-tutorials.html

书：

Introduction to Python Programming and Developing GUI Applications with PyQT里的第七章

代码下载:

http://ubuntuone.com/2PV5w09KstmM3zzNYCpYyE

搜索

复制