chap11图形用户界面设计课件.ppt

1、Python程序设计与案例教程第11章 图形用户界面设计2 第12章 图形用户界面设计 1.Tkinter：Tkinter是一款流行的跨平台GUI工具包，是Python标准的GUI库下载地址：http:/www.python.org/topics/thinter2.wxPython下载地址：http:/wxpython.org/download.php 常用的GUI工具有Tkinter、wxPython、Jython、IronPython几种3 第12章 图形用户界面设计 GUI程序的基础是根窗体(Root Window)l使用tkinter之前需要先导入，导入方式为：import _tkin

2、terl 然后再实例化tkinter模块的Tk类，如：root=Tk()4 第12章 图形用户界面设计 GUI元素被称为控件控件及类控件及类说说 明明Frame承载其他GUI元素Label显示不可编辑的文本或图片Button用户激活按钮时执行一个动作Entry接受并显示一行文本Text接受并显示多行文本Checkbutton允许用户选择或反选一个选项Radiobutton允许用户从多个选项中选取一个Menu与顶层窗口相关的选项Scrollbar滚动其他控件的滚动条Canvas图形绘图区：直线、圆、照片、文字等Dialog通用对话框的标记部分GUI核心窗口控件说明和其对应的tkinter类5 第

3、12章 图形用户界面设计 例：创建图形窗口1 import tkinter2 win=tkinter.Tk()3 win.title(string=名言警句)4 b=tkinter.Label(win,text=阅读使人充实，会谈使人敏捷，写作使人精确。培根)5 b.pack()6 win.mainloop()6 第12章 图形用户界面设计 tkinter模块包含15个tkinter控件控件名称控件名称说说 明明Button按钮控件；在程序中显示按钮Canvas画布控件；用来画图形，如线条、多边形等Checkbutton多选框控件；用于在程序中提供多项选择框Entry输入控件；定义一个简单的文

4、字输入字段Frame框架控件；定义一个窗体，以作为其他控件的容器Label标签控件；定义一个文字或是图片标签Listbox列表框控件；此控件定义一个下拉方块Menu菜单控件；定义一个菜单栏、下拉菜单和弹出菜单Menubutton菜单按钮控件；用于显示菜单项Message消息控件；定义一个对话框Radiobutton单选按钮控件；定义一个单选按钮Scale范围控件；定义一个滑动条，来帮助用户设置数值Scrollbar滚动条控件；定义一个滚动条Text文本控件；定义一个文本框Toplevel与Frame控件类似，可以作为其他控件的容器7 第12章 图形用户界面设计 1.颜色名称常量Windows操

5、作系统的颜色名称常量SystemActiveBorderSystemActiveCaptionSystemAppWorkspaceSystemBackgroundSystemButtonFaceSystemButtonHighlightSystemButtonShadowSystemButtonTextSystemCaptionTextSystemDisabledTextSystemHighlightSystemHighlightTextSystemInavtiveBorderSystemInavtiveCaptionSystemInactiveCaptionTextSystemMenuSys

6、temMenuTextSystemScrollbarSystemWindowSystemWindowFrameSystemWindowText8 第12章 图形用户界面设计 2.大小的测量单位测量tkinter控件内大小时，是以像素为单位的例：实现定义Button控件的文字与边框之间的水平距离是20像素from tkinter import*win=Tk()Button(win,padx=20,text=关闭,command=win.quit).pack()win.mainloop()9 第12章 图形用户界面设计 例：包含关闭按钮的图形界面1 from tkinter import*2 wi

7、n=Tk()3 Button(win,padx=20,text=关闭,command=win.quit).pack()4 Button(win,padx=2c,text=关闭,command=win.quit).pack()5 Button(win,padx=8m,text=关闭,command=win.quit).pack()6 Button(win,padx=2i,text=关闭,command=win.quit).pack()7 Button(win,padx=20p,text=关闭,command=win.quit).pack()8 win.mainloop()10 第12章 图形用户

8、界面设计 3.共同属性每一个tkinter控件都有下列共同属性：(1)anchor：定义控件在窗口内的位置或者文字信息在控件内的位置，位置可以是N、NE、E、SE、SW、W、NW或者CENTER。(2)Background(bg)：定义控件的背景颜色以及一个背景颜色为SystemHighlight的文字标签。(3)bitmap：定义显示在控件内的bitmap图片文件。(4)borderwidth：定义控件的边框宽度，单位是像素。(5)command：当控件有特定的动作发生，此属性定义动作发生时所调用的 Python 函数。(6)cursor：定义当鼠标指针移经控件上时鼠标指针的类型。(7)fo

9、nt：如果控件支持标题文字，可以使用此属性来定义标题文字的字体格式。允许同时设置多个字体样式。(8)foreground(fg)：定义控件的前景(文字)颜色。11 第12章 图形用户界面设计 3.共同属性（9）height：如果是 Button、Label 或者 Text 控件，此属性定义以字符数目为单位的高度。对于其他的控件，则定义以像素(pixel)为单位的高度。（10）highlightbackground：定义控件在没有键盘焦点时，绘制 highlight 区域的颜色。（11）highlightcolor：定义控件在有键盘焦点时，绘制 highlight 区域的颜色。（12）highl

10、ightthickness：定义 highlight 区域的宽度，以像素为单位。（13）image：定义显示在控件内的图片文件。（14）ustify：定义多行的文字标题的排列方式。（15）padx，pady：定义控件内的文字或者图片与控件的边框之间的水平与垂直距离。（16）relief：定义控件的边框形式。（17）variable：将控件的数值映像到一个变量。（18）width：如果是 Button、Label 或者 Text 控件，此属性定义为以字符数目为单位的宽度。其他控件则定义为以像素(pixel)为单位的宽度。12 第12章 图形用户界面设计 例：设置控件背景颜色。1 from tki

11、nter import*2 win=Tk()3 Label(win,background=#00ff00,text=曾伴浮云归晚翠，犹陪落日泛秋声。).pack()4 Label(win,background=#00ff00,text=世间无限丹青手，一片伤心画不成。).pack()5 win.mainloop()13 第12章 图形用户界面设计 例：设置文字标签的字体。1 from tkinter import*2 win=Tk()3 Label(win,font=(Times,16,bold),text=溯洄从之，道阻且长。溯游从之，宛在水中央。).pack()4 Label(win,fo

12、nt=(细明体,24,bold italic underline),text=溯洄从之，道阻且长。溯游从之，宛在水中央。).pack()5 win.mainloop()14 第12章 图形用户界面设计 Button控件用来创建按钮，按钮内可以显示文字或者图片。Button控件的方法：(1)flash()：将前景与背景颜色互换来产生闪烁的效果。(2)invoke()：执行command属性所定义的函数。15 第12章 图形用户界面设计 Button widget的属性如下：(1)activebackground：当按钮在作用中时的背景颜色。(2)activeforeground：当按钮在作用中时

13、的前景颜色。(3)bitmap：显示在按钮上的位图。(4)default：如果设置此属性，则此按钮为默认按钮。(5)disabledforeground：当按钮在无作用时的前景颜色。(6)image：显示在按钮上的图片，此属性的顺序在 text 与 bitmap 属性之前。(7)state：定义按钮的状态，可以是 NORMAL、ACTIVE 或者 DISABLED。(8)takefocus：定义用户是否可以使用 Tab 键，来改变按钮的焦点。(9)text：显示在按钮上的文字。如果定义了 bitmap 或者 image 属性，text 属性就不会被使用。(10)underline：一个整数偏移

14、值，表示按钮上的文字哪一个字符要加底线，第一个字符的偏移值是 0。(11)wraplength：一个以屏幕单位(screen unit)为单位的距离值，用来决定按钮上的文字在哪里需要换成多行。其默认值是不换行。16 第12章 图形用户界面设计 例：文字上添加底线。1 from tkinter import*2 win=Tk()3 Button(win,text=我的主页,underline=0,command=win.quit).pack()4 win.mainloop()17 第12章 图形用户界面设计 Canvas控件用来创建与显示图形，如弧形、位图、图片、线条、椭圆形、多边形、矩形等。C

15、anvas控件的方法如下：(1)create_arc(coord,start,extent,fill)：创建一个弧形。(2)create_bitmap(x,y,bitmap)：创建一个位图。(3)create_image(x,y,image)：创建一个图片。(4)create_line(x0,y0,x1,y1,.,xn,yn,options)：创建一个线条。18 第12章 图形用户界面设计 例：绘制一个弧形，在窗口客户区的(10,50)与(240,210)坐标间画一个弧形，起始角度是0度，结束角度是 270 度，使用红色来填满弧形区块。1 from tkinter import*2 win=T

16、k()3 coord=10,50,240,2104 canvas=Canvas(win)5 canvas.create_arc(coord,start=0,extent=270,fill=red)anvas.pack()6 win.mainloop()19 第12章 图形用户界面设计 例：绘制一个线条。1 from tkinter import*2 win=Tk()3 canvas=Canvas(win)4 canvas.create_line(10,10,40,120,230,270,width=3,fill=green)5 canvas.pack()6 win.mainloop()20 第

17、12章 图形用户界面设计 Entry控件用来在窗体或者窗口内创建一个单行的文本框。(1)textvariable：此属性为用户输入的文字或者要显示在 Entry 控件内的文字。(2)get()：此方法可以读取 Entry widget 内的文字。21 第12章 图形用户界面设计 例：创建一个简单计算器。1 from tkinter import*2 win=Tk()3 frame=Frame(win)#创建窗体4 5#创建一个表达式6 def calc():7 result=+str(eval(expression.get()8 label.config(text=result)9 10 la

18、bel=Label(frame)11 entry=Entry(frame)12 expression=StringVar()13 entrytextvariable=expression 14 1516 button1=Button(frame,text=“等于 ,command=calc)17 entry.focus()18 frame.pack()19 entry.pack()20 label.pack(side=LEFT)21 button1.pack(side=RIGHT)22 23#开始程序循环24 frame.mainloop()22 第12章 图形用户界面设计 Checkbutt

19、on控件用来创建复选框。Checkbutton控件的属性：(1)onvalue，offvalue：设置 Checkbutton 控件的 variable 属性所指定的变量所要存储的数值。如果复选框没有被勾选，此变量的值为offvalue；如果复选框被勾选，此变量的值为onvalue。(2)indicatoron：将此属性设置成0，可以将整个控件变成复选框。checkbutton 控件的方法：(1)select()：选择复选框，并且设置变量的值为 onvalue。(2)flash()：将前景与背景颜色互换来产生闪烁的效果。(3)invoke()：执行 command 属性所定义的函数。(4)to

20、ggle()：改变核取按钮的状态。如果核取按钮当前的状态是on，就改成off；反之亦然。23 第12章 图形用户界面设计 例：创建3个复选框。1 from tkinter import*2 win=Tk()3 check1=Checkbutton(win,text=苹果)4 check2=Checkbutton(win,text=香蕉)5 check3=Checkbutton(win,text=橘子)6 check1.select()7 check1.pack(side=LEFT)8 check2.pack(side=LEFT)9 check3.pack(side=LEFT)10 win.ma

21、inloop()24 第12章 图形用户界面设计 Tkinter提供grid、pack和place三种完全不同的布局管理类：(1)pack()：将控件放置在父控件内之前，规划此控件在区块内的位置。(2)grid()：将控件放置在父控件内之前，将此控件规划成一个表格类型的架构。(3)place()：将控件放置在父控件内的特定位置。25 第12章 图形用户界面设计 pack()方法的选项：(1)expand：让控件使用所有剩下的空间。(2)fill：此选项决定控件如何填满parcel的空间，可以是X、Y、BOTH或者NONE，此选项必须在expand等于1时才有作用。(3)ipadx，ipady：

22、此选项与 fill 选项共同使用，来定义窗体内的控件与窗体边界之间的距离。(4)padx，pady：此选项定义控件之间的距离。此选项的单位是像素；也可以是其他测量单位，如厘米、英寸等。(5)side：此选项定义控件放置的位置，可以是 TOP(靠上对齐)、BOTTOM(靠下对齐)、LEFT(靠左对齐)与 RIGHT(靠右对齐)。26 第12章 图形用户界面设计 grid()方法将控件依照表格的栏列方式来放置在窗体或者窗口内。grid()方法的选项：(1)row：设置控件在表格中的第几列。(2)column：设置控件在表格中的第几栏。(3)columnspan：设置控件在表格中合并栏的数目。(4)

23、rowspan：设置控件在表格中合并列的数目。27 第12章 图形用户界面设计 例：使用grid()方法创建一个 55 的按钮数组。1 from tkinter import*2#主窗口3 win=Tk()4#创建窗体5 frame=Frame(win,relief=RAISED,borderwidth=2)6 frame.pack(side=TOP,fill=BOTH,ipadx=5,ipady=5,expand=1)7#创建按钮数组8 for i in range(5):9 for j in range(5):10 Button(frame,text=(+str(i)+,+str(j)+)

24、.grid(row=i,column=j)11#开始窗口的事件循环 12 win.mainloop()28 第12章 图形用户界面设计 place()方法设置控件在窗体或者窗口内的绝对地址或者相对地址。place()方法的选项：(1)anchor：定义控件在窗体或者窗口内的方位。(2)bordermode：定义控件的坐标是否要考虑边界的宽度。(3)height：定义控件的高度，单位是像素。(4)width：定义控件的宽度，单位是像素。(5)in(in_)：定义控件相对于参考控件的位置。(6)relheight：定义控件相对于参考控件(使用 in_选项)的高度。(7)relwidth：定义控件相

25、对于参考控件(使用 in_选项)的宽度。(8)relx：定义控件相对于参考控件(使用 in_选项)的水平位移。(9)rely：定义控件相对于参考控件(使用 in_选项)的垂直位移。(10)x：定义控件的绝对水平位置，默认值是 0。(11)y：定义控件的绝对垂直位置，默认值是 0。29 第12章 图形用户界面设计 例：使用place()方法创建2个按钮。第1个按钮的位置在距离窗体左上角的(40,40)坐标处，第2个按钮的位置在距离窗体左上角的(140,80)坐标处。按钮的宽度是80个像素，按钮的高度是40个像素。1 from tkinter import*2 win=Tk()3 frame=Fr

26、ame(win,relief=RAISED,borderwidth=2,width=400,height=300)4 frame.pack(side=TOP,fill=BOTH,ipadx=5,expand=1)5 button1=Button(frame,text=Button 1)6 button1.place(x=40,y=40,anchor=W,width=80,height=40)7 button2=Button(frame,text=Button 2)8 button2.place(x=140,y=80,anchor=W,width=80,height=40)9 win.mainl

27、oop()30 第12章 图形用户界面设计 事件指可能会发生在对象上的事，要求有相应响应。11.4.1 事件的属性当有事件发生时，tkinter 会传给事件处理例程一个 event 变量。变量名变量名属属 性性char键盘的字符码，例如A键的char属性等于A，F1键的char属性无法显示keycode键盘的ASCII码，例如A键的keycode属性等于65keysym键盘的符号，例如A键的keysym属性等于A，F1键的keysym属性等于F1height，width控件的新高度与宽度，单位是像素num事件发生时的鼠标按键码widget目前的鼠标光标位置x，y加载和表示字体x_root，y_

28、root相对于屏幕左上角的目前鼠标光标位置type显示事件的种类31 第12章 图形用户界面设计 用户可以使用以下 tkinter 控件的方法将控件与事件绑定起来：l after(milliseconds,callback,arguments)l after_cancel(identifier)l after_idle(callback,arguments)lbindtags()lbind(event,callback)lbind_all(event,callback)lbind_class(widgetclass,event,callback)l lunbind(event)lunbind_

29、all(event)l unbind_class(event)32 第12章 图形用户界面设计 协议处理例程：tkinter提供拦截系统信息的机制，用户可以拦截这些系统信息，然后设置成自己的处理例程。通常处理的协议如下：(1)WM_DELETE_WINDOW：当系统要关闭该窗口时发生。(2)WM_TAKE_FOCUS：当应用程序得到焦点时发生。(3)WM_SAVE_YOURSELF：当应用程序需要存储内容时发生。33 第12章 图形用户界面设计 tkinter 提供下列不同类型的对话框，这些对话框的功能存放在 tkinter 的不同子模块中，主要包括：lmessagebox 模块lfiledi

30、alog 模块lcolorchooser 模块34 第12章 图形用户界面设计 例：创建两种对话框。1 from tkinter import*2 import tkinter.filedialog3#创建主窗口 4 win=Tk()5 win.title(string=打开文件和保存文件)6#打开一个【打开】对话框7 def createOpenFileDialog():8 myDialog1.show()9#打开一个【另存为】对话框10 def createSaveAsDialog():myDialog2.show()11#单击按钮后,即打开对话框12 Button(win,text=打开

31、文件,command=createOpenFileDialog).pack(side=LEFT)Button(win,text=保存文件,command=createSaveAsDialog).pack(side=LEFT)13#设置对话框打开或保存的文件类型14 myFileTypes=(Python files,*.py*.pyw),(All files,*)15#创建一个【打开】对话框16 myDialog1=tkinter.filedialog.Open(win,filetypes=myFileTypes)17#创建一个【另存为】对话框18 myDialog2=tkinter.filedialog.SaveAs(win,filetypes=myFileTypes)19#开始程序循环 20 win.mainloop()35 第12章 图形用户界面设计 36 第12章 图形用户界面设计 资料搜集