Python-GUI界面设计(tkinter)

文章目录

前言

此篇文章介绍的是有关 GUI(Graphical User Interface)图形用户界面的设计。
使用到的库是 tkintertkinter库在 python3版本开始就是自带的库,IDLE就是通过这个库设计的。
文章的内容是经过自己网上整理总结得到的,并非照搬照套,主要介绍自己清楚的内容。
有的参数不是必须的,文章中介绍的只是部分的参数。

相关介绍

Python GUI编程(Tkinter)-菜鸟教程

Python Tkinter Wiki

Tk图形用户界面(GUI)

一、函数方法

  • 下面的函数方法是基于 import tkinterfrom tkinter import ttk的导入来的。
    如果你是使用的是 imort tkinter as tk这种的,将下面的 tkinter替换成你所定义的别名就行。
  • 函数方法中有些方法只是简单介绍, 详细的内容会在之后的步骤提及
  • 对于一个组件来说,如果你的组件创建时是在 window窗口创建的,
    之后的 place方法就会在对应窗口中进行放置;
    如果是在 frame框架中创建,则是在 frame框架中进行放置。
  • 组件的放置和删除方法是通用的。

函数方法介绍window = tkinter.Tk()

创建一个窗口window. title("标题")

为设置窗口标题window. geometry("宽度x高度")

设置窗口宽和高window. destroy()

删除窗口window. mainloop()

消息循环window. withdraw()

隐藏窗口window. configure(background='Blue')

设置窗口的背景色button = tkinter.Button(window,text='退出',command=lambda:out(window),width=2,height=5)

创建按钮button. place(x=0,y=70,anchor='center') 绝对位置

放置按钮button. place(relx=0.5,rely=0.5,anchor='center') 相对位置

放置按钮text = tkinter.Label(window,bd=4,fg='red',bg='white',text='内容111111111111111')

创建单行文本var = tkinter.StringVar()

创建一个StringVar类型的变量varvar. set("内容")

设置var变量的内容var. get()

获取var变量的内容message = tkinter.Message(window,width=20,textvariable=var)

创建多行文本entry = tkinter.Entry(window,width=20,show='*')

创建单行输入框entry .get()

获取单行输入框的内容text_input = tkinter.Text(window,width=20,height=10)创建多行输入框text_input. insert('insert','内容')

向多行输入框插入数据text_input .get("行数-1.列数-1","行数-1.列数-1")

获取多行输入框的输入值select = ttk.Combobox(window,width=12,textvariable=tkinter.StringVar(),state="readonly")

创建下拉框select [values']

= lis设置下拉框中的值roll = tkinter.Scrollbar(window)

创建滚动条roll. pack(side = tkinter.LEFT,fill = tkinter.Y)

设置滚动条的位置text_input. config(yscrollcommand=roll.set)

文本绑定垂直滚动条roll. config(command=text_input.yview)

垂直滚动条绑定文本frame = tkinter.Frame(width=100,height=100,bg='white')

创建一个frame框架button = tkinter.Button(frame,text='按钮',width=5,height=2)

创建一个在frame框架中的按钮note = ttk.Notebook()

创建一个Notebook分页栏(实在想不到什么好的名词来描述了)note. place(relx=0.02,rely=0.02,relwidth=0.8,relheight=0.8)

放置分页栏note. add(frame,text='第一页')

将框架添加至分页栏

二、导入

  • 通常导入的话使用下面第一行代码进行导入就行
import tkinter
  • 但对于某些功能时,需要导入一个 ttk模块
  • 如果你使用的是 from tkinter import *,那么之后的涉及到的类似 tkinter.Tk()代码,可以对tkinter进行省略,直接使用 Tk()函数来进行创建即可。
import tkinter
from tkinter import ttk

三、窗口

  • 步骤[5]的删除窗口对其他的组件是通用的,之后不再赘述

[1]. 创建

  • 创建窗口的方法比较简单,执行 tkinter.Tk()即可。
  • 因为我们需要对这个窗口进行操作,所以得用一个实例对象来保存这个窗口。

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()

[2]. 标题

  • 上一个步骤执行完毕后,默认会给窗口设置一个名为 tk的标题。
    如果我们需要设置自定义的标题时,就得用到 title方法。

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')

[3]. 大小

  • 在设置大小时,使用 geometry方法,参数里的x是英文字母,大小写不会有影响。
  • 对于200×300的大小,第一个参数200是宽度,第二个参数300是高度。
    如果没有设置窗口大小时,默认大小为200×200

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('200x300')

[4]. 背景

  • 使用 configure方法设置background参数的值,来改变背景色。
  • 改变背景色时传入的参数大小写皆可
  • 对于其他组件如文本、按钮等,同样能对组件进行设置背景色。
    只需要将实例对象名window变更成组件的实例对象名即可。

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('200x300')
window.configure(background='BlUe')

[5]. 删除

使用 window.destry()就可以对窗口进行删除了


import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('200x300')
window.configure(background='BlUe')
window.destroy()

四、按钮

  • 步骤[2]和步骤[3]放置按钮的方法对其他组件是通用的

[1]. 创建

  • 和窗口不同,其他组件创建时不会直接将组件放置到窗口中。

参数介绍window窗口的实例对象text按钮的文本内容command点击按钮后执行的函数命令width按钮宽度,单位为像素height按钮高度,单位为像素

button = tkinter.Button(window,text='退出',command=lambda:window.destroy(),width=3,height=2)

[2]. 放置(绝对位置)

参数介绍x横轴坐标,x= 0

时将会把按钮放置在窗口最左侧y纵轴坐标,y= 0

时将会把按钮放置在窗口最上方anchor锚点,锚点有四种类型(nw,ne,sw,se),不填此参数时锚点默认为nw。 nw为按钮框的左上角;ne为按钮框的右上角;sw为按钮框的左下角;se为按钮框的右下角。

前两个参数设置的坐标就是锚点的坐标。

button.place(x=40,y=90,anchor='nw')

[3]. 放置(相对位置)

参数介绍relx横轴坐标,relx= 0

时将会把按钮放置在窗口最左侧,relx= 1

时将会把按钮放置在窗口最右侧rely纵轴坐标,rely= 0

时将会把按钮放置在窗口最上方,rely= 1

时将会把按钮放置在窗口最下方anchor锚点,锚点有四种类型(nw,ne,sw,se),不填此参数时锚点默认为nw。 nw为按钮框的左上角;ne为按钮框的右上角;sw为按钮框的左下角;se为按钮框的右下角。

前两个参数设置的坐标就是锚点的坐标。

button.place(relx=1,rely=1,anchor='se')

[4]. 代码

  • 如果要将按钮放置在窗口的右下角,锚点可以设置为se,然后再将这个锚点的坐标设置成窗口的右下角即可。
  • 横轴和纵轴坐标是必须给定的,而锚点参数anchor可以省略不填,但对于特殊的应用场景就得使用到anchor参数来设置锚点了。

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('200x300')
button = tkinter.Button(window,text='退出',command=lambda:window.destroy(),width=5,height=2)

button.place(relx=1,rely=1,anchor='se')

五、单行文本

[1]. 创建

  • 如果传入的颜色或者是文本内容是需要输入获取时,可以将等号后面的内容替换成对应的字符串变量
  • 步骤六将会介绍有关文本内容的获取方法,如果你想要获取文本的内容时,也可以提前定义好一个变量,然后把这个变量的值赋给 text参数,同样能够对文本的内容进行获取。

参数介绍window窗口实例对象bd文本框的大小(并非文字的大小)fg字体颜色bg背景色,传入的参数为颜色的英文单词text显示的内容信息

text = tkinter.Label(window,bd=4,fg='red',bg='white',text='内容111111111111111')

[2]. 代码

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('200x200')
text = tkinter.Label(window,bd=4,fg='red',bg='white',text='内容111111111111111')

text.place(relx=0.2,rely=0.2)

六、多行文本

  • 获取多行文本内容的方式比较不同,请注意区别。

[1]. 创建

  • Stringvar是一种类型,你可以参考一下大佬的博客python基础知识-GUI编程-TK-StringVar进行理解。
  • 多行文本的内容虽然可以通过 text参数来进行设置,但是要获取对应文本的内容时还需要另一个 Stringvar的变量,所以可以通过设置这个变量的值以达到 text参数的效果。
  • 在多行文本当中,只能够设置对应的宽度,以 \n作为换行的标志。如果某行文本的宽度大于限制的宽度时,多余的部分将会移动到下一行(包括文本末尾的换行符)

函数方法介绍var = tkinter.StringVar()

设置一个StringVar类型的变量varvar. set(内容)

设置变量var的值 参数介绍varStringVar类型的变量window窗口实例对象width宽度textvariable绑定的文本变量

var = tkinter.StringVar()
var.set("第一行\n第二行\n第三行")
message = tkinter.Message(window,width=200,textvariable=var)

[2]. 获取

  • 由于多行文本的内容是通过 StringVar类型的变量var设置得到的,所以你可以通过获取变量var的值来得到多行文本的内容。
  • 经过测试,无法直接通过 get()方法或 .get('行.列','end')的方法获取 message对象的内容。(后面将会介绍 .get('行.列','end')方法的使用,目前可以先忽略)

函数方法介绍var. get()

获取变量var的值

var.get()

[3]. 代码

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('300x300')

def show(self):
    print(self.get())

var = tkinter.StringVar()
var.set("第一行\n第二行\n第三行")
message = tkinter.Message(window,width=200,textvariable=var)
message.place(x=20,y=50)

button = tkinter.Button(window,width=8,height=1,command=lambda:show(var),text='获取输入值')
button.place(x=30,y=200)

七、输入框

  • 步骤 [2]对于其他组件如文本等也适用

[1]. 创建

  • 创建时仅能设置输入框的宽度,而不能设置高度。

参数介绍window窗口实例对象width输入框宽度,单位为像素show当用户输入时显示的内容,通常是在输入密码时使用

entry = tkinter.Entry(window,width=20,show='*')

[2]. 获取

  • 在获取输入框的时候,大部分情况得和按钮、自定义函数结合使用。通过 .get()的方法将输入框的值获取,并作为形参传入自定义函数中。
  • 需要注意的是,直接在代码中使用 .get()方法时不会显示内容,因为 entry.get()只会执行一次,而开始阶段输入框是没有内容的,所以 entry.get()执行一次之后就失效了,具体效果请看步骤 [3]
entry.get()

[3]. 代码

  • 代码中使用了一个自定义函数 getget函数的参数 self就相当于主函数中的 entry

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('200x200')

def show(self):
    print("通过按钮获取的输入框值为:",self.get())

entry = tkinter.Entry(window,width=20,show='*')
entry.place(x=30,y=30)

button = tkinter.Button(window,width=8,height=1,command=lambda:show(entry),text='获取输入值')
button.place(x=60,y=100)

print("不通过按钮获取的输入框值为:",entry.get())
window.mainloop()

八、多行输入框

  • 多行输入框类似网页的留言输入区,在需要输入大量文字时可用
  • 此处介绍的多行输入框,同样具有显示多行文本的作用。

[1]. 创建

  • 多行输入框和单行输入框不同,不能使用到 show参数,但是可以设置对应的宽度和高度。

参数介绍window窗口的实例对象width输入框的宽度height输入框的高度

text_input = tkinter.Text(window,width=20,height=10)

[2]. 插入

函数方法介绍text_input. insert('insert','内容')

第一个参数 insert

表示的是操作的方式为插入到多行输入框(多行文本框)的末尾,第二个参数为插入的数据。 参数介绍text_input多行输入框的实例对象

text_input.insert('insert','内容')

[3]. 获取

  • 获取多行输入框的值需要传入两个参数,第一个参数由行列和中间的小数点组成表示读取的起止位置,第二个字符串参数 2.2表示读取的截止位置。
  • 第二个参数设置成 end时,就是截止到用户输入的最后一个字符位置。
  • 读取数值是逐行读取,从左向右读取。

参数介绍text_input多行输入框的实例对象 0.0

获取文本的起止位置,表示第 1

行第 1

列。 2.2

获取文本的结束位置,表示第 3

行第 3

列,设置为 end

时表示用户输入的最后一个字符

text_input.get("0.0","2.2")

[3]. 代码

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('300x300')

def show(self):
    print(self.get('0.0',"end"))

text_input = tkinter.Text(window,width=20,height=10)
text_input.place(x=30,y=30)

text_input.insert('insert','第一行\n')
text_input.insert('insert','第二行\n')
text_input.insert('insert','第三行\n')

button = tkinter.Button(window,width=8,height=1,command=lambda:show(text_input),text='获取输入值')
button.place(x=30,y=200)

九、下拉框

  • 下拉框需要使用 from tkinter import ttkttk模块进行使用

[1]. 创建

  • Stringvar是一种类型,你可以参考一下大佬的博客python基础知识-GUI编程-TK-StringVar进行理解。
  • 测试了一下 height参数,虽然可以进行设置不报错,但好像没有效果。

参数介绍window窗口的实例对象width宽度textvariable文本的类型,设置成 tkinter.StringVar()

即可。state下拉框的状态,设置成 readonly

为只读模式,不填 state

参数时为可读可写模式。通常下拉框是为了显示或者是让用户进行选择的,所以大多情况都是设置成 readonly

select = ttk.Combobox(window,width=12,textvariable=tkinter.StringVar(),state="readonly")

[2]. 添加

  • 创建好下拉框后,就需要对其中的值进行添加,可将一个列表的值传入下拉框
  • 对列表中的元素类型没有较大限制,可字符串也可数字。

参数介绍select下拉框的实例对象lis列表

lis = [1,2,'fox']
select['values'] = lis

[3]. 代码

Python-GUI界面设计(tkinter)

import tkinter
from tkinter import ttk
window = tkinter.Tk()
window.title('标题')
window.geometry('300x300')

def show(self):
    print(self.get())

select = ttk.Combobox(window,width=12,textvariable=tkinter.StringVar(),state="readonly")
lis = [1,2,'fox']
select['values'] = lis
select.place(x=30,y=100)

button = tkinter.Button(window,width=8,height=1,command=lambda:show(select),text='获取输入值')
button.place(x=30,y=200)

十、滚动条

  • 文章仅介绍垂直滚动条的代码,水平滚动条的创建方法类似。
  • 下面介绍的是Text组件的绑定方法,Listbox组件、Entry组件 绑定的方法相同。

[1]. 创建

  • 滚动条单独存在时,没有实际的作用所以通常会与其他组件绑定使用。
  • 垂直滚动条常与Text、Canvas和Listbox组件绑定。
  • 水平滚动条常与Entry组件绑定。

函数方法介绍roll = tkinter.Scrollbar(window)

创建滚动条roll. pack(side = tkinter.LEFT,fill = tkinter.Y)

设置滚动条的位置 参数介绍window窗口实例对象side滚动条的位置, tkinter.LEFT

表示将滚动条放置在窗口左侧, tkinter.RIGHT

表示将滚动条放置在窗口右侧, tkinter.BOTTOM

表示将滚动条放置在窗口下方, tkinter.TOP

表示将滚动条放置在窗口上方。fill滚动条的移动方向,垂直滚动条用 tkinter.Y

,水平滚动条用 tkinter.X


roll = tkinter.Scrollbar(window)
roll.pack(side = tkinter.LEFT,fill = tkinter.Y)

text_input = tkinter.Text(window,width=100,height=20)
for i in range(100):
    text_input.insert('insert',f'第{i+1}行\n')
text_input.pack(expand=tkinter.YES,fill=tkinter.BOTH)

[2]. 绑定

  • 如果你在创建滚动条时是垂直滚动条,却使用了xview的方法绑定,此时滚动条将会失效。
  • 垂直滚动条使用yview方法和yscrollcommand参数,水平滚动条使用xview方法xscrollcommand参数。

函数方法介绍text_input.config(yscrollcommand=roll.set)文本text_input绑定垂直滚动条rollroll.config(command=text_input.yview)垂直滚动条roll绑定文本text_input 参数介绍yscrollcommand用于设置需要绑定的垂直滚动条信息,设置时需要使用到set方法xscrollcommand用于设置需要绑定的水平滚动条信息,设置时需要使用到set方法command用于设置需要绑定的组件信息,使用组件的 yview

方法设置垂直滚动条,使用组件的 xview

方法设置垂直滚动条。

text_input.config(yscrollcommand=roll.set)
roll.config(command=text_input.yview)

[3]. 代码

Python-GUI界面设计(tkinter)

import tkinter
window = tkinter.Tk()
window.title('标题')
window.geometry('300x300')

roll = tkinter.Scrollbar(window)
roll.pack(side = tkinter.LEFT,fill = tkinter.Y)

text_input = tkinter.Text(window,width=100,height=20)
for i in range(100):
    text_input.insert('insert',f'第{i+1}行\n')
text_input.pack(expand=tkinter.YES,fill=tkinter.BOTH)

text_input.config(yscrollcommand=roll.set)
roll.config(command=text_input.yview)

十一、框架控件

  • 先介绍一下 Frame的使用方法,框架控件主要的用处是用来放置你所需要的组件,类似于一个内置的窗口。 Frame可用于分页的功能。
  • 放置 Frame的时,可使用通用的方法 place进行放置

[1]. 创建

函数方法介绍frame = tkinter.Frame(width=100,height=100,bg='white')

创建一个frame框架 参数介绍width宽度height高度bg背景色

frame = tkinter.Frame(width=100,height=100,bg='white')

[2]. 添加

  • 此步骤的添加,是给框架添加组件,使用的例子是按钮,将之前的窗口对象 window替换为框架对象 frame即可。同样的按钮创建完毕后,还需要使用 place方法将按钮进行放置,此时放置的范围就只能是框架的范围了。

函数方法介绍button = tkinter.Button(frame,text='按钮',width=5,height=2)

创建一个在frame框架中的按钮 参数介绍frameFrame框架的对象text按钮名称width按钮宽度height按钮高度

button = tkinter.Button(frame,text='按钮',width=5,height=2)

[3]. 代码

  • 为了更好地区别,窗口的背景色设置成了黑色,而框架的范围内为白色

Python-GUI界面设计(tkinter)

import tkinter
from tkinter import ttk

window = tkinter.Tk()
window.title('标题')
window.geometry('300x300')
window.configure(background='black')

frame = tkinter.Frame(width=100,height=100,bg='white')
frame.place(x=50,y=50)

button = tkinter.Button(frame,text='按钮',width=5,height=2)
button.place(x=10,y=10)

十二、分页

  • 在实现分页功能前,你可以先去看看 步骤十一了解一下框架的使用方法。
  • 分页的功能是通过 Frame框架和 Notebook组件结合实现。

[1]. 创建

  • 分页的参数有挺多的,你可以自行搜索
  • 因为直接设置参数height和width时,高度和宽度是定死的,所以要实现框架随着界面的变化而变化时就得使用到 步骤[2]的放置方法。

函数方法介绍note = ttk.Notebook()

创建一个Notebook分页栏(实在想不到什么好的名词来描述了)

note = ttk.Notebook()

[2]. 放置

函数方法介绍note. place(relx=0.02,rely=0.02,relwidth=0.8,relheight=0.8)

放置分页栏 参数介绍relx横轴坐标(相对位置)rely纵轴坐标(相对位置)relwidth宽度(相对于窗口),范围为[0,1]relheight高度(相对于窗口),范围为[0,1]

note.place(relx=0.02,rely=0.02,relwidth=0.8,relheight=0.8)

[3]. 框架

  • 一个框架就相当于一页,如果你需要多页,就创建多个frame框架与分页栏进行绑定就行。
  • 在分页中不是使用 place方法将 Frame框架进行放置,直接使用 place方法会将 frame直接放置到 window窗口而不是分页栏 notebook

函数方法介绍frame = tkinter.Frame()

创建Frame框架note. add(frame,text='第一页')

将框架添加至分页栏button = tkinter.Button(frame,text='按钮',width=5,height=2)

在已有框架中创建按钮button. place(x=0,y=0)

设置按钮位于框架的位置 参数介绍frameFrame框架的实例对象text文本内容width宽度height高度x横轴坐标y纵轴坐标

frame = tkinter.Frame()
note.add(frame,text='第一页')
button = tkinter.Button(frame,text='按钮',width=5,height=2)
button.place(x=0,y=0)

[4]. 代码

  • 为了体现分页的效果,我创建了两个框架来表示两页
  • 点击上方的 第一页第二页就能显示出不同的 Frame框架内容

Python-GUI界面设计(tkinter)

import tkinter
from tkinter import ttk

window = tkinter.Tk()
window.title('标题')
window.geometry('300x300')
window.configure(bg='black')

note = ttk.Notebook()
note.place(relx=0.02,rely=0.02,relwidth=0.8,relheight=0.8)

frame1 = tkinter.Frame()
note.add(frame1,text='第一页')
button1 = tkinter.Button(frame1,text='按钮1',width=5)
button1.place(relx=0.5,rely=0.5)

frame2 = tkinter.Frame()
note.add(frame2,text='第二页')
button2 = tkinter.Button(frame2,text='按钮2',width=5)
button2.place(relx=0.5,rely=0.5)

Original: https://blog.csdn.net/smallfox233/article/details/112093464
Author: 梦之海岛
Title: Python-GUI界面设计(tkinter)

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/723790/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球