【Python应用】tkinter简介

简介

tkinter是Python自带的GUI库。

tkinter的全称是Tk Interface。

其中Tk是开发桌面应用的GUI工具库，它是Tcl的标准GUI，而Tcl全称Tool Command Language，是一种动态编程语言，可用于桌面应用开发。关于Tk和Tcl，可以在https://www.tcl.tk/查看到更多的内容，这里不多做介绍。

Tk和Tcl并不是Python的一部分，Python只不过提供了与Tk和Tcl交互的接口，而Tk和Tcl是系统本身支持的，Window、Linux和MacOS都是支持的，所以通过Python tkinter创建的GUI程序可以在不同的操作系统使用。

一个简单的示例

通过如下命令可以将tkinter导入到Python：

import tkinter
1

之后就可以使用了，以下是一个最简单的例子：

import tkinter

if __name__ == '__main__':
    root = tkinter.Tk()
    root.mainloop()
1
2
3
4
5

通过Tk()就创建了一个窗口组件，mainloop()表示开始渲染这个窗口。执行该脚本得到的应用：

这其实只是一个什么也没有的框体。为了能够使其有用，还需要在这个窗口组件之上增加额外的组件，来完成需要的功能。这个将在后面详细介绍。

组件介绍

首先对上面的代码做如下的修改：

import tkinter
import tkinter.ttk as ttk

class application(tkinter.Frame):
    pass

if __name__ == '__main__':
    root = tkinter.Tk()
    app  = application(master=root)
    root.title("Config Editor")
    root.geometry("1200x800")
    root.mainloop()
1
2
3
4
5
6
7
8
9
10
11
12

这里创建了一个类application，它的参数是窗口组件，这样在类的初始化过程中就可以同时初始化窗口组件，增加各类组件，完成需要实现的功能。这里的类并不是必要的，之所以要创建一个类，而不是直接在上述代码中实现，是因为最终窗口是有特定的功能需要实现的，通过类的方式来包装能够更好地实现功能。

title()函数为窗口组件增加名称，会在窗口头部显示（下图红色部分）；而geometry()函数设置了窗口的尺寸，也方便后续增加内容。其执行结果如下：

后续的内容就是在类application中增加各类组件。

Frame

Frame表示的是一个框架组件，在屏幕上显示为一个矩形区域，多用来作为容器。

它的创建也很简单（事实上所有的组件创建都很简单）：

fram = tkinter.Frame(root, bg='red', height=30, width=130)
1

这里通过Frame类创建框架实例，参数说明如下：

• root表示父组件，通常所有的组件都有一个父组件，而最常用的父组件就是tkinter.Tk()；
• 之后的参数，比如bg、height、width，都是可选的，它们规定了框架的属性，比如颜色、高度、长度等，所有Frame支持的属性如下所示：

Frame创建之后并不会直接显示，而是需要通过pack()来布局和显示：

fram.pack(side=tkinter.TOP, anchor=tkinter.SE)
1

实际上除了使用pack()来进行布局，还有其它的方法，这里说明：

• pack()：按添加顺序排列组件。
• grid()：按行列形式排列组件。
• place()：能够实现自定义排列组件。

这里只说明pack()的实现。

pack()接受一系列的位置参数，说明如下：

某些参数通过字符串来指定，但是并不会直接使用字符串，而是会用tkinter中预定义的值：

# -anchor and -sticky
N='n'
S='s'
W='w'
E='e'
NW='nw'
SW='sw'
NE='ne'
SE='se'
NS='ns'
EW='ew'
NSEW='nsew'
CENTER='center'

# -fill
NONE='none'
X='x'
Y='y'
BOTH='both'

# -side
LEFT='left'
TOP='top'
RIGHT='right'
BOTTOM='bottom'
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

所以在代码中会看到tkinter.TOP这样的值。

最终得到的结果如下：

右侧红色部分就是渲染的结果，可以看到Frame就是一个矩形的图形，它本身意义不大，通常用来作为其它组件的容器。

Label

Label通常是一个带字符串的标签，创建方式如下：

tkinter.Label(fram, text='Text to find:').pack(side=tkinter.LEFT)
1

通常也是创建和布局两部分，这里直接组合在一起了，显示结果如下：

下面是另外一个例子：

status = tkinter.Label(master, text="Check status here", bd=1, relief=tkinter.SUNKEN, anchor=tkinter.W)
status.pack(side=tkinter.BOTTOM, fill=tkinter.X)
1
2

显示结果如下：

Entry也接收两个部分的参数：

• 父组件；
• 可选参数，其可选值如下：

Entry

Entry表示的是文本框，可以在里面输入文本，并在后台处理。它的创建和布局：

self.edit = tkinter.Entry(fram, width=30)
self.edit.pack(side=tkinter.LEFT, fill=tkinter.BOTH, expand=1, pady=2, padx=(4, 4))
1
2

Entry也接收两个部分的参数：

• 父组件；
• 可选参数，其可选值如下：

执行结果如下：

Entry与前面介绍的组件的差别在于它是可交互的，所以还有额外的事情可以做，比如说当输入内容之后按下Enter键来触发事件：

self.edit.bind("<Return>", (lambda event: self.search_bar()))
1

这里通过bind()函数绑定一个事件，该事件回调search_bar()函数：

def search_bar(self):
    print("Input: %s" % self.edit.get())
    pass
1
2
3

以上是一个示例函数，它做的事情就是打印获取到的值，执行结果如下：

在Entry文本框中输入内容之后按下Enter键就会在命令行窗口打印文本框中的内容。

另外再介绍一个函数：

self.edit.focus_set()
1

它设置文本框为焦点，这样打开程序的时候鼠标就会直接在该文本框中，可以直接进行输入。

除了使用Enter键，另外的选择就是在旁边增加按钮，下面将介绍。

Button

Button增加一个按键，创建和布局的方式如下：

butt = tkinter.Button(fram, text='Search', relief=tkinter.GROOVE, command=self.search_bar)
butt.pack(side=tkinter.RIGHT, padx=(4, 4))
1
2

Button类的参数如下：

• 父组件；
• 可选参数：

本例中的command指定了在Entry中的search_bar()函数，所以按键之后该函数也会被回调，结果跟Entry的一致。

执行结果如下：

Panedwindow

PanedWindow组件是一个空间管理组件。跟Frame组件类似，都是为组件提供一个框架，不过PanedWindow允许让用户调整应用程序的空间划分。

PanedWindow组件会为每一个子组件生成一个独立的窗格，用户可以自由调整窗格的大小。下面是一个例子：

paned = ttk.Panedwindow(root, orient=tkinter.HORIZONTAL)
paned.pack(fill=tkinter.BOTH, expand=True, padx=(4, 4))

frame_left = ttk.Frame(paned, height=800, relief="groove")
frame_right = ttk.Frame(paned, relief="groove")

paned.add(frame_left, weight=2)
paned.add(frame_right, weight=10)
1
2
3
4
5
6
7
8

显示的结果：

红框中通过两个Frame分割了Panedwindow。

Menu

Menu用来创建菜单栏。

tkinter提供了三种类型的菜单，分别是：toplevel（主目录菜单），pull-down（下拉式菜单），pop-up（弹出式菜单，或称快捷式菜单）。

创建Menu的方式：

menubar = tkinter.Menu(root)
file_menu = tkinter.Menu(menubar, tearoff=0)
generate_menu = tkinter.Menu(menubar, tearoff=0)
1
2
3

Menu除了接收父组件，还包含一系列的可选参数：

本例创建了两个Menu，第一个是父Menu，后面的是子Menu。前者的父Menu组成一组横向的菜单，而后者的子Menu组成下拉的菜单。首先是横向的菜单：

menubar.add_cascade(label="File", menu=file_menu)
menubar.add_cascade(label="Generate", menu=generate_menu)
1
2

然后通过root的config()函数配置root的属性以显示菜单：

root.config(menu=menubar)
1

得到的结果如下：

不过前面创建的只是空的菜单，下面是添加后续内容：

# Create parent menu.
menubar = tkinter.Menu(root)

# Create child menu.
file_menu = tkinter.Menu(menubar, tearoff=0)
file_menu.add_command(label="Open JSON file...",
			command=self.load_from_json)
file_menu.add_command(label="Open binary file...",
			command=self.load_from_bin)
generate_menu = tkinter.Menu(menubar, tearoff=0)
generate_menu.add_command(label="Generate binary...",
			command=self.generate_bin)

# Add child menu to parent menu.
menubar.add_cascade(label="File", menu=file_menu)
menubar.add_cascade(label="Generate", menu=generate_menu)

# Draw menu.
root.config(menu=menubar)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

最终得到的结果：

这里的load_from_json()等回调函数的实现不在本文的涉及范围，所以这里不作说明。

Treeview和Scrollbar

Treeview组件主要是提供多栏的显示功能。在设计时也可以在左边栏设计成树状结构或是称层次结构，用户可以显示或隐藏任何部分。它可以跟Scrollbar一起使用，用来滚动显示Treeview组件的可见范围。

下面是创建Treeview的示例：

frame_left = ttk.Frame(paned, height=800, relief="groove")
self.left = ttk.Treeview(frame_left, show="tree")
1
2

Treeview的可见参数：

下面是创建Scrollbar的示例：

self.tree_scroll = ttk.Scrollbar(frame_left, orient="vertical", command=self.left.yview)
1

Scrollbar的可见参数：

Treeview还包含一些有用的函数：

self.left.configure(yscrollcommand=self.tree_scroll.set)
self.left.bind("<<TreeviewSelect>>", self.on_config_page_select_change)
self.left.bind("<Enter>",  lambda e: self.in_left.set(True))
self.left.bind("<Leave>",  lambda e: self.in_left.set(False))
self.left.bind("<MouseWheel>",  self.on_tree_scroll)
1
2
3
4
5

第一个函数configure()用于设置样式，与前面创建的Scrollbar匹配。

后面的bind()是绑定时间的，后面的比较好理解，第一个<<>>需要解释下：

• << TreeviewSelect>>，代表选择变化是发生；
• << TreeviewOpen>>，item的open=True时发生；
• << TreeviewClose>>，item的open=False时发生。

上面的item可以通过Treeview.focus()和Treeview.selection()可获取。

最终结果：

注意这里没有对绑定的回调函数进行说明，这不在本文的讨论范围内。不过还需要介绍如何往Tree中增加内容，其使用的函数是：

self.left.insert('', 'end', text=key)
1

insert()函数接收如下的参数：

• parent：对于表格类型的Treeview，parent一般为空。对于树形类型的Treeview，parent为父节点；
• index：指明在何处插入新的项；可以是'end'，也可以是数字；比如，如果要让新插入的项成为第一个子节点或者在第一行，index就设为0；如果是第二个子节点或者第二行，就是设置index为1；如果在最末端插入项，就设置index='end'；
• iid：如果没有赋值，就使用系统自动生成的id；如果输入了id，必须保证与现有的id不重复；否则系统会自动生成id；
• **kw：设置插入项的属性，支持的属性有：

得到的示例结果如下：

Canvas

Canvas属于tkinter，就是画布，可以将图形，文本，小部件或框架放置在画布上。

创建画布的方式：

self.conf_canvas = tkinter.Canvas(frame_right, highlightthickness=0)
1

第一个参数是父组件，第二个参数是可选的，其可选值如下：

Canvas也可以跟Scrollbar绑定：

self.page_scroll = ttk.Scrollbar(frame_right, orient="vertical", command=self.conf_canvas.yview)
self.conf_canvas.configure(yscrollcommand=self.page_scroll.set)
1
2

Canvas最重要的是一系列的create_xx()函数，比如下面的代码创建了一个组件：

self.conf_canvas.create_window(0, 0, window=self.right_grid, anchor='nw')
1

Canvas也支持bind()函数：

self.conf_canvas.bind('<Enter>',  lambda e: self.in_right.set(True))
self.conf_canvas.bind('<Leave>',  lambda e: self.in_right.set(False))
self.conf_canvas.bind("<Configure>", self.on_canvas_configure)
self.conf_canvas.bind_all("<MouseWheel>", self.on_page_scroll)
1
2
3
4

filedialog

用于打开一个选择文件的窗口：

    self.last_dir = '.'    
    path = filedialog.askopenfilename(
            initialdir=self.last_dir,
            title="Load file",
            filetypes=(("%s files" % file_type, "*.%s" % file_ext), ("all files", "*.*"))
            )
1
2
3
4
5
6

执行之后，选择“File->Open JSON file…”，结果如下：

选择之后就得到path可以在代码中使用该文件。