GUI编程简介

主流3大GUI框架

框架名称	说明
Tkinter	一个轻量级的跨平台图形用户界面（GUI）开发工具，是Tk图形用户界面工具包标准的Python接口
Kivy	基于OpenGL ES 2，能够让使用相同源代码创建的程序能跨平台运行。这个框架是事件驱动的，基于主循环，非常适合开发游戏
PyQt	一个跨平台的框架。它是用C++编写的。这是一个非常全面的库。它包含许多工具和API。它被广泛应用于许多行业。它涵盖了很多平台。PyQt是Qt库的Python版本

---

1. Tkinter

1.1 Tkinter概述

Tkinter是Python的标准GUI库，由Tk和Python interface组成。Tk原本是Tcl编程语言的界面库，后来开发出了Python接口。Tkinter在Python 2和Python 3中有所不同，在Python 2中称为Tkinter，在Python 3中称为tk。

1.2 Tkinter与ttk模块比较

• 组件数量不同
• 组件风格不同
• 为组件定义样式的方法不同

IDLE是用Tkinter设计出来的。导入方式：

import tkinter as tk
# or
from tkinter import *

---

窗口设计

2.1 创建窗口

实例化Tk()方法，创建窗口对象，并设置窗口标题。

2.2 设置窗口属性

• title(): 设置窗口标题
• geometry("宽x高"): 设置窗口大小及位置
• maxsize(): 设置窗口最大尺寸
• minsize(): 设置窗口最小尺寸
• configure(bg=color): 设置窗口背景色
• resizable(True, True): 设置窗口大小是否可更改
• state("zoomed"): 窗口最大化
• iconify(): 窗口最小化
• inconbitmap(): 设置窗口默认图标

2.3 设置窗口位置

（演示代码：属性及位置）

from tkinter import *
win=Tk()
win.title("tkinter的窗口的位置")     #窗口的标题
win.configure(bg="#a7ea90")        #窗口的背景颜色
winw=300                              #窗口的宽度
winh=220                              #窗口的高度
scrw=win.winfo_screenwidth()            #屏幕的宽度
scrh=win.winfo_screenheight()           #屏幕的高度
x=(scrw-winw)/2                        #窗口的水平位置
y=(scrh-winh)/2                        #窗口的垂直位置
win.geometry("%dx%d+%d+%d" %(winw,winh,x,y))            #设置窗口位置
str="程序员鄙视链"
txt=Label(win,text=str,bg="#a7ea90").pack()
win.mainloop()

---

2.4 窗口设计核心

Widget组件分为7类：文本类、按钮类、选择列表类、容器类、会话类、菜单类、进度条类。它们拥有公共属性和方法，如：

• 公共属性：文本颜色、背景色、组件宽度、高度等
• 公共方法：
  • config(): 配置组件参数
  • keys(): 获取组件参数列表

（演示代码：widget组件公共属性与方法）

# Widget的公共属性以及公共方法
# tkinter的布局方法之一：pack详细说明:https://zhuanlan.zhihu.com/p/431052225
from tkinter import *
win=Tk()
win.title("充值成功")
win.geometry("300x240")
str="1、一级VIP30天\n\n2、每天额外赠送300金币7天\n\n3、全英雄限免30天\n"
text=Label(win,text="\n充值成功!",font="Times 18 bold").pack()
text1=Label(win,text="\n恭喜获得：\n",font="16").pack(anchor=W,padx=45)
text2=Label(win,text=str,font="18",fg="red",justify="left").pack()
win.mainloop()

---

布局管理

3.1 pack()方法

按添加顺序布局，属性包括：

• side: 停靠方向（LEFT、TOP、RIGHT、BOTTOM）
• fill: 填充方向（X、Y、BOTH、NONE）
• expand: 是否扩展（YES、NO）
• anchor: 停泊方向（E、S、W、N及其组合，CENTER）
• ipadx、ipad、padx、pady

（演示代码：）

# pack()方法的使用
# padx和pady：设置组件边界距离窗口边界的距离，单位为px
# ipadx和ipady：设置组件内文字距离组件边界的距离，单位为px

from tkinter import *
win=Tk()
win.title("tkinter的初使用")
txt1=Label(win,text="象吃狮",bg="#ba55d3",font=14)
txt2=Label(win,text="狮吃虎",bg="#c1ffc1",font=14)
txt3=Label(win,text="虎吃豹",bg="#cdb5cd",font=14)
txt4=Label(win,text="豹吃狼",bg="#ba55d3",font=14)
txt5=Label(win,text="狼吃狗",bg="#c1ffc1",font=14)
txt6=Label(win,text="狗吃猫",bg="#cdb5cd",font=14)
txt7=Label(win,text="猫吃鼠",bg="#ba55d3",font=14)
txt8=Label(win,text="鼠吃象",bg="#c1ffc1",font=14)

txt1.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt2.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt3.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt4.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt5.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt6.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt7.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
txt8.pack(side="left",padx="10",pady="5",ipadx="6",ipady="4")
win.mainloop()

3.2 grid()方法

行/列定位，属性包括：

• row: 行（从0算起）
• column: 列（从0算起）
• rowspan、columnspan: 跨行、跨列
• sticky: 开始方向（E、S、W、N）
  

（演示代码：）

# encoding: utf-8
# grid()的使用
# row表示行，column表示列

from tkinter import *
win=Tk()     #创建根窗口
win.title("grid()方法")    #添加标题
# grid(row=0,column=0,padx=10)设置组件位于第0行第0列，与其他组件的水平间距为10
Label(win,text="1*1=1",bg="#E0FFFF").grid(row=0,column=0,padx=10)
Label(win,text="1*2=3",bg="#E0FFFF").grid(row=1,column=0,padx=10)
Label(win,text="1*3=3",bg="#E0FFFF").grid(row=2,column=0,padx=10)
Label(win,text="1*4=4",bg="#E0FFFF").grid(row=3,column=0,padx=10)

Label(win,text="2*2=4",bg="#EEA9B8").grid(row=1,column=1,padx=10)
Label(win,text="2*3=6",bg="#EEA9B8").grid(row=2,column=1,padx=10)
Label(win,text="2*4=8",bg="#EEA9B8").grid(row=3,column=1,padx=10)

Label(win,text=" 3*3=9 ",bg="#F08080").grid(row=2,column=2,padx=10)
Label(win,text="3*4=12",bg="#F08080").grid(row=3,column=2,padx=10)

Label(win,text="4*4=16",bg="#FFE1FF").grid(row=3,column=3,padx=10)
win.mainloop()

3.3 place()方法

允许指定组件的大小和位置。

（演示代码：）

# encoding: utf-8
#place()的使用
#width和 height,x和y

from tkinter import *
win=Tk()
win.title("华容道")     # 添加窗口标题
win.geometry("240x300")      # 设置窗口大小
txt1=Label(win,text="赵云",bg="#FF1493",relief="solid",font=14)    #华容道游戏中的滑块
txt2=Label(win,text="曹操",bg="#EEEE00",relief="solid",font=14)
txt3=Label(win,text="黄忠",bg="#FF1493",relief="solid",font=14)
txt4=Label(win,text="张飞",bg="#FF1493",relief="solid",font=14)
txt5=Label(win,text="关羽",bg="#FF1493",relief="solid",font=14)
txt6=Label(win,text="马超",bg="#FF1493",relief="solid",font=14)
txt7=Label(win,text="卒",bg="#9932CC",relief="solid",font=14)
txt8=Label(win,text="卒",bg="#9932CC",relief="solid",font=14)
txt9=Label(win,text="卒",bg="#9932CC",relief="solid",font=14)
txt0=Label(win,text="卒",bg="#9932CC",relief="solid",font=14)
# width为组件宽度，height为组件高度，x为滑块左上角定点的横坐标，y为滑块左上角的纵坐标
txt1.place(width=60,height=120,x=0,y=0)
txt2.place(width=120,height=120,x=60,y=0)
txt3.place(width=60,height=120,x=180,y=0)
txt4.place(width=60,height=120,x=0,y=120)
txt5.place(width=120,height=60,x=60,y=120)
txt6.place(width=60,height=120,x=180,y=120)
txt7.place(width=60,height=60,x=60,y=180)
txt8.place(width=60,height=60,x=120,y=180)
txt9.place(width=60,height=60,x=0,y=240)
txt0.place(width=60,height=60,x=180,y=240)
win.mainloop()

---

文本类组件

4.1 Label标签组件

• 文本标签
• 图片标签
  
  

（演示代码：）

# encoding: utf-8
# label组件的使用
# 设置label的样式以及设置文本样式

from tkinter import *
win=Tk()                           #添加标题
win.title("斗兽棋游戏的食物链")    #添加标题
# textd定义Label标签里的文本内容，bg表示Label的背景颜色
txt1=Label(win,text="象",bg="#FFEBCD",width=5,padx=4,pady=4,font="14")
txt2=Label(win,text="狮",bg="#c1ffc1",width=5,padx=4,pady=4,font="14")
txt3=Label(win,text="虎",bg="#FFEBCD",width=5,padx=4,pady=4,font="14")
txt4=Label(win,text="豹",bg="#c1ffc1",width=5,padx=4,pady=4,font="14")
txt5=Label(win,text="狼",bg="#FFEBCD",width=5,padx=4,pady=4,font="14")
txt6=Label(win,text="狗",bg="#c1ffc1",width=5,padx=4,pady=4,font="14")
txt7=Label(win,text="猫",bg="#FFEBCD",width=5,padx=4,pady=4,font="14")
txt8=Label(win,text="鼠",bg="#c1ffc1",width=5,padx=4,pady=4,font="14")
# foreground设置label组件的文字颜色
txtr1=Label(win,text="→",padx=2,pady=2,foreground="#B22222").grid(row=1,column=2)
txtr2=Label(win,text="→",padx=2,pady=2,foreground="#B22222").grid(row=1,column=4)
txtb1=Label(win,text="↓",padx=2,pady=2,foreground="#B22222").grid(row=2,column=5)
txtb2=Label(win,text="↓",padx=2,pady=2,foreground="#B22222").grid(row=4,column=5)
txtl1=Label(win,text="←",padx=2,pady=2,foreground="#B22222").grid(row=5,column=4)
txtl2=Label(win,text="←",padx=2,pady=2,foreground="#B22222").grid(row=5,column=2)
txtt1=Label(win,text="↑",padx=2,pady=2,foreground="#B22222").grid(row=4,column=1)
txtt2=Label(win,text="↑",padx=2,pady=2,foreground="#B22222").grid(row=2,column=1)
# 设置斗兽棋游戏的棋子的位置
txt1.grid(row=1,column=1)
txt2.grid(row=1,column=3)
txt3.grid(row=1,column=5)
txt4.grid(row=3,column=5)
txt5.grid(row=5,column=5)
txt6.grid(row=5,column=3)
txt7.grid(row=5,column=1)
txt8.grid(row=3,column=1)
win.mainloop()

4.2 Entry单行文本框组件

（演示代码：）

# encoding: utf-8


from tkinter import *

win=Tk()
win.configure(bg="#EFE5D2")    #设置窗口的背景颜色
user=PhotoImage(file="user.png")     #用户名图标
psw=PhotoImage(file="psw.png")       #密码图标

Label(win,image=user,bg="#fff").grid(row=0)    #显示用户名图标
Entry(win).grid(row=0,column=1,padx=10,pady=10)  #用户名文本框

Label(win,image=psw,bg="#fff").grid(row=1)       #显示密码图标
Entry(win,show="*").grid(row=1,column=1,padx=10,pady=10)    #密码文本框，输入的内容显示为“*”

Label(win,text="确定",relief="groove").grid(row=2,columnspan=2,pady=10)
win.mainloop()

4.3 Text多行文本框组件

（演示代码：）

i = 0   #单击按钮的次数，初始值为0


def show():
    global i  #声明为全局变量
    i += 1   #单击一次按钮，ijiu就加1
    label.config(text="你点了我\t" + str(i) + "下")


from tkinter import *

root = Tk()        #创建根窗口
text = Text(root, width=70, height=20, bg="#CAE1FF", relief="solid",font=14)   #创建多行文本框

photo = PhotoImage(file='ico.png')        # 创建了一个图象对象
text.image_create(END, image=photo)       # text中插入图像
text.insert(INSERT, "在这里添加文本:\n")  # 添加文本
text.pack()       #包装文本框，没有此步骤，文本框无法显示在窗口中
# 插入组件
bt = Button(root, text='你点我试试', command=show, padx=10)  #创建按钮
text.window_create("2.end", window=bt)  # 将按钮放置在text中
label = Label(root, padx=10, text="你点了我0下")   #创建Label组件
text.window_create("3.end", window=label)  # 将Label组件放置在text中
root.mainloop()

4.4 Spinbox输入选择组件

方法及含义：

• activebackground: 当Spinbox处于“active”状态下的背景颜色
• buttonbackground: 箭头的背景颜色
• buttoncursor: 鼠标悬停在箭头上的样式
• command: 当用户通过箭头调节内容时调用某函数
• disabledbackground: 当Spinbox处于“disabled”状态下的背景颜色
• esportselection: 指定选中的文本是否可以复制到剪切板
• justify: Spinbox内文本的对齐方式
• readonlybackground: 当Spinbox处于“readonly”状态下的背景色
• state: 设置Spinbox的状态（normal、disabled、readonly）
  

（演示代码：）

# Spinbox组件

from tkinter import *
win=Tk()             #创建根窗口
win.title("购买道具")    #添加窗口标题
Label(win,text="购买道具：").grid(row=0,column=0,pady=10)
#通过元组定义可选择的值
Spinbox(win,values=("绿水晶","红宝石","生命水")).grid(row=0,column=1,pady=10)
Label(win,text="购买数量：").grid(row=1,column=0,pady=10)
#通过from_和to定义可选的数值范围
Spinbox(win,from_=1,to=5).grid(row=1,column=1,pady=10)
Label(win,text="限购5件").grid(row=1,column=2,pady=10)
Label(win,text="支付方式：").grid(row=2,column=0,pady=10)
Spinbox(win,values=("金币","钻石","点券")).grid(row=2,column=1,pady=10)
win.mainloop()

4.5 Scale规定数值范围组件

（演示代码：）

# Scale

from tkinter import *
# num=0   #设置初始值
# # 单击加号时，滑块向右移动一格，并且计算爱心暴击
def up1():
    if scale1.get() < 50:
        val = scale1.get() + 1
        scale1.set(val)
        num=val*5
        txt.config(text="爱心暴击 "+str(num))
# 单击减号时，滑块向左移动一格，并且计算爱心暴击
def down1():
    if scale1.get() > 0:
        val = scale1.get() - 1
        scale1.set(val)
        num = val * 5
        txt.config(text="爱心暴击 " + str(num))
#滑动滑块时，计算爱心暴击
def hit(widget):
    num=scale1.get()*5
    txt.config(text="爱心暴击 " + str(num))
win = Tk()
win.title("爱心暴击")
txt = Label(text="爱心暴击+0")
txt.pack(side=TOP)
btndown = Button(win, text="-", command=down1, width=2).pack(side="left")

# scale()的使用
# win为指定的父容器
# from_和to指定Scale组件值的范围
# resolution定义滑块每次更改的数值
# orient定义显示方向：HORIZONTAL水平显示，VERTICAL垂直显示

# 设置滑块的取值范围为0-50，进步值为1,
scale1 = Scale(win, from_=0, to=50, resolution=1, orient=HORIZONTAL,showvalue=0,command=hit,troughcolor="#22EBBB")
scale1.pack(side="left")
num = Entry()
btnup = Button(win, text="+", command=up1, width=2).pack(side="left")
win.mainloop()

---

按钮类组件

5 按钮

• Button按钮组件

• 

• Radiobutton单选按钮组件

• 

• Checkbutton复选框组件

• 

（演示代码：）

from tkinter import *

def counter():
    global count,win
    count+=1
    lal=Label(win, text='我被点击'+str(count)+'次')
    lal.pack()
 
count=0
win=Tk()
win.wm_title('Button示例_1')
btn=Button(win,text='按我!',command=counter)  #绑定方式1: command
btn.pack()
      
win.mainloop()

# text：显示的文本内容
# command：指定的事件处理函数
from tkinter import *

def callCheckbutton():
    #改变 v 的值，即改变 Checkbutton 的显示值

    if  v.get()=='未选中' :
        v.set('选中')
    else:
         v.set('未选中')
root = Tk()
v = StringVar()
v.set('未选中')
#绑定 v 到 Checkbutton 的属性 textvariable
Checkbutton(root, text = 'check python', textvariable = v,command = callCheckbutton).pack()

mainloop()

---