340 likes | 550 Views
School of Computer and Information Science Southwest Forestry University 2014.5. Introduction to Computer Programming. 计算机编程导论. 西南林业大学 计算机与信息学院 2014.5. Chapter 9 GUI Programming. GUI : Graphical User Interface (图形用户界面) 常用 GUI 工具 Tkinter : Python 的标准 GUI 库 wxPython :功能强于 Tkinter ,跨平台
E N D
School of Computer and Information Science Southwest Forestry University 2014.5 Introduction to Computer Programming
计算机编程导论 西南林业大学 计算机与信息学院 2014.5
Chapter 9 GUI Programming • GUI:Graphical User Interface(图形用户界面) • 常用GUI工具 • Tkinter:Python的标准GUI库 • wxPython:功能强于Tkinter,跨平台 • Jython:基于Java • IronPython:增加了对.NET应用程序的支持 • wxPython下载安装 • http://wxpython.org/download.php • wxPython 2.8(与Python 2.7对应)
Chapter 9 GUI Programming 窗体在屏幕中的位置
Chapter 9 GUI Programming • GUI设计方法——搭积木式: • 命令式:以明确的文字命令,按一定的顺序添加窗体和控件 • 自己动手式:用鼠标拖拽的方式将控件放置到窗体的合适位置
9.2 Basic Questions [Q9-1] Create a form
9.2 Basic Questions #Ques9_1.py #coding=GBK import wx #导入wxPython包 class Frame0(wx.Frame): def __init__(self,superior): #创建frame对象 wx.Frame.__init__(self,parent=superior, title=u'第一个窗体', size=(300, 300)) #创建一个wx.Panel(面板)实例以容纳框架上的所有内容 panel = wx.Panel(self) #把响应鼠标移动事件wx.EVT_MOTION绑定到函数OnMove panel.Bind(wx.EVT_MOTION, self.OnMove) #在panel上放置静态文本框,以显示“Pos”提示信息 wx.StaticText(parent=panel,label="Pos:", pos=(10, 20)) #在panel上放文本框,用来输出信息 self.posCtrl = wx.TextCtrl(parent=panel,pos=(40, 20))
9.2 Basic Questions def OnMove(self, event): #获取鼠标的位置 pos = event.GetPosition() #将鼠标位置在文本框中显示出来 self.posCtrl.SetValue("%s, %s" % (pos.x, pos.y)) #主程序 if __name__ == '__main__': app =wx.App() frame = Frame0(None) frame.Show(True) app.MainLoop() • 图形界面程序的工作原理: • (1) 当鼠标在panel上移动时,会发生wx.EVT_MOTION事件; • (2) 函数OnMove在鼠标移动事件wx.EVT_MOTION发生时被调用,称为事件处理函数。
9.3 Frame wx.Frame的格式: • Frame:框架(窗体),容器,可移动、缩放,包含标题栏、菜单等。是所有框架的父类。 • 子类的构造函数格式: • wx.Frame. __init__ (parent, id, title, pos, size, style, name ) • parent:框架的父窗体。对于顶级窗体,该值为None。 • id:新窗体的wxPython ID号。我们可以明确地传递一个,也可传递-1,这时wxPython将自动生成一个新的ID。 • title:窗体的标题
9.3 Frame • pos:wx.Point对象,它指定这个新窗体的左上角在屏幕中的位置。通常(0,0)是显示器的左上角。当将其设定为wx.DefaultPosition,其值为(-1,-1),表示让系统决定窗体的位置。 • size:一个wx.Size对象,它指定这个新窗体的初始尺寸。当将其设定为wx.DefaultSize时,其值为(-1,-1),表示由系统决定窗体的初始尺寸。 • style:指定窗体的类型的常量。 • name:框架的名字,指定后我们可以使用它来寻找这个窗体。 • 当一个参数前面的所有参数都被设定的时候,该参数可以省略其名称直接填写其值,否则需要使用 “参数名=值”的格式。
9.3 Frame 【EG9-1】:Create a frame • #Exp9_1.py • #步骤1: • import wx #导入wx模块 • #步骤2: • class Frame1(wx.Frame): #程序的框架类继承于wx.Frame类 • def __init__(self, superior): • wx.Frame.__init__(self, parent=superior, title="My Window", pos= (100,200), size= (400,200)) • #步骤3: • #主程序 • if __name__ == '__main__': • app = wx.App( ) #建立应用程序对象 • frame=Frame1(None) #建立框架类对象 • frame.Show(True) #显示框架 • app.MainLoop( ) #建立事件循环
9.3 Frame • 建立GUI程序的三大步骤: • 导入必须的wxPython包 • 建立框架类:框架类的父类为wx.Frame,在框架类的构造函数中必须调用父类的构造函数。 • 建立主程序:通常做4件事——建立应用程序对象、建立框架类对象、显示框架、建立事件循环 • 执行frame.Show(True)后,框架才看得见,执行app.MainLoop( )后,框架才能处理事件。 • 如需在窗体上增加其他控件,可在构造函数中增加代码 • 如需处理事件,可增加框架类的成员函数,如问题9-1 • 由于wx.Frame.__init__( )方法只有一个参数parent没有默认值,因而最简单的调用方式是 • wx.Frame.__init__(self, parent=None) • 这将生成一个默认位置、默认大小的窗体
9.3 Frame wx.Frame的样式: • wx.CAPTION:增加标题栏 • wx.DEFAULT_FRAME_STYLE:默认样式 • wx.CLOSE_BOX:标题栏上显示“关闭”按钮 • wx.MAXIMIZE_BOX:标题栏上显示“最大化”按钮 • wx.MINIMIZE_BOX:标题栏上显示“最小化”按钮 • wx.RESIZE_BORDER:边框可改变尺寸 • wx.SIMPLE_BORDER:边框没有装饰 • wx.SYSTEM_MENU:增加系统菜单(有“关闭”、“移动”、“改变尺寸”等功能)。 • wx.FRAME_TOOL_WINDOW:给框架一个比正常小的标题栏,使框架看起来像一个工具框窗体。
9.3 Frame • 对一个窗体控件可以使用多个样式,使用或运算符(|)连接即可。 • 比如:wx.DEFAULT_FRAME_STYLE样式等价于: • wx.MAXIMIZE_BOX | wx.MINIMIZE_BOX | wx.RESIZE_BORDER | wx.SYSTEM_MENU | wx.CAPTION | wx.CLOSE_BOX • 要从一个组合样式中去掉个别的样式可以使用^操作符。例如要创建一个默认样式的窗体,但要求用户不能缩放和改变窗体的尺寸,可以使用这样的组合: • wx.DEFAULT_FRAME_STYLE ^ (wx.RESIZE_BORDER | wx.MAXIMIZE_BOX | wx.MINIMIZE_BOX)
9.3 Frame 【例9-2】不同样式的组合效果
9.4 Controls 【例9-3】计算1+2+…+n(使用文本框 )
9.4 Controls 1. Button 【例9-4】在窗体上放置“关闭”按钮
9.4 Controls 2. StaticText 【例9-5】使用静态文本框
9.4 Controls • 3. TextCtrl • 【例9-6】使用文本框
9.4 Controls 4. Menu 5. ToolBar 6. StatusBar 7. MessageDialog 8. TextEntryDialog 9. SingleChoiceDialog 10. CheckBox 11. RadioButton 12. ListBox 13. ComboBox 14. TreeCtrl
9.5 Boa-constructor Boa-constructor: • 一款优秀的界面设计软件 • 功能强大的Idle • 设计界面时可通过鼠标调整控件的大小和位置 • 下载地址:http://sourceforge.net/projects/boa-constructor/?source=dlp
9.5 Boa-constructor 1. 安装 Windows: boa-constructor-0.6.1.src.win32.exe 2. 运行Boa.py文件 启动软件:用Python2.7的Idle打开并运行Boa.py文件,或直接运行也可。 (C:\Python27\Lib\site-packages\boa-constructor\Boa.py )
9.5 Boa-constructor 窗口组成: 控件窗口:包含界面设计用到的各种控件 编辑器:可管理用户文件,包含交互式窗口Shell,错误信息和运行信息显示窗口 检视器:可用来修改控件的属性
9.5 Boa-constructor • 【例9-12】数学运算:用两个文本框输入运算数,用一个文本框输出运算结果,用一个组合框来选择运算符,用一个按钮来进行“确定”计算的操作。 • 步骤: • 1. 启动Boa Constructor • 2. 在“编辑器”的“文件”菜单下“新建”一个“wx.Frame”
9.5 Boa-constructor • 3. 添加主程序 • 在编辑器窗口中单击“源”页,显示代码。在显示出的代码未尾增加下列主程序: • #主程序 • if __name__=="__main__": • app=wx.App( ) • frame=Frame1(None) • frame.Show(True) • app.MainLoop( ) • 为了能在程序中正常使用汉字,还需要在程序的最前面加上下面这行代码: • #coding=GBK
9.5 Boa-constructor • 4. 保存文件
9.5 Boa-constructor 5. 显示框架设计器
9.5 Boa-constructor 6. 添加控件
9.5 Boa-constructor 7. 修改控件属性
9.5 Boa-constructor 8. 为按钮添加单击事件处理函数
9.5 Boa-constructor • 9. 在按钮的事件处理函数中编写代码 • 在编辑器窗口中单击“源”页,显示出代码。在刚才添加的事件处理函数OnButton1Button( )内用下列代码替换该处的“event.Skip()”语句: • operator=self.cmb1.GetValue( ) #获得cmb1中的字符串 • x=self.textCtrl1.GetValue( ) #获得textCtrl1中的字符串 • y=self.textCtrl2.GetValue( ) #获得textCtrl2中的字符串 • x=float(x) • y=float(y) • if operator=='+': • z=x+y • if operator=='-': • z=x-y • if operator=='*': • z=x*y • if operator=='/': • z=x/y • self.textCtrl3.SetValue(str(z)) #在textCtrl3内显示计算结果
9.5 Boa-constructor 10. 运行程序