agon-qt

Posts Tagged ‘qt’

使用eric5集成环境写qt gui程序

February 17th, 2013, Posted by: agon   

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里添加以下代码(本文不解释代码含义,推荐阅读本节开头介绍的图书章节):

import sys

from ui.Ui_welcome import * #调用界面python代码

class MyForm(QtGui.QDialog):

    def __init__(self, parent=None):

        QtGui.QWidget.__init__(self, parent)

        self.ui = Ui_Dialog()

        self.ui.setupUi(self)

if __name__ == "__main__":

    app = QtGui.QApplication(sys.argv)

    myapp = MyForm()

    myapp.show()

    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。双击在编辑器里打开,找到如下代码:
<

    @pyqtSlot()

    def on_buttonHello_clicked(self):

        """

        Slot documentation goes here.

        """

        # TODO: not implemented yet

        raise NotImplementedError

把raise NotImplementedError,修改为自定义的代码,修改代码如下:

    @pyqtSlot()

    def on_buttonHello_clicked(self):

        """

        Slot documentation goes here.

        """

        #当点击hello button的时候,把labelMessage的text改为lineUserNam里的文字

        self.labelMessage.setText("Hello " + self.lineUserNam.text())

修改main scrpt运行程序

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

import sys

from PyQt4.QtGui import QApplication #添加

from ui.welcome import * #这里有修改

 

if __name__ == "__main__":

    app = QApplication(sys.argv) #修改

    myapp = Dialog()

    myapp.show()

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

Page 1 of 11