天天看点

Python的GUI学习笔记——Tkinter笔记 【二】认识控件与几何管理Tkinter 控件几何管理

这篇就简略地介绍Tkinter库中有哪些控件,以后会为每一个控件都详细地写一篇笔记记录。

这篇主要讲解用于几何管理的三个方法的使用。

文章目录

  • Tkinter 控件
  • 几何管理
    • pack
      • 解答疑惑:side和anchor参数使用疑惑,expand效果疑惑
      • pack类提供的方法
    • grid
        • 举个例子
      • grid类提供的方法
    • place
        • place类提供的方法

Tkinter 控件

目前有15种Tkinter的控件。下表简单简单介绍各个控件:

控件 描述
Button 按扭控件:添加按钮
Canvas 画布控件:显示图形元素,用于绘图
Checkbutton 多选框控件:提供多个选项的选择框,嗯用来制作多选题不可少
Entry 输入控件:接受用户的输入
Frame 框架控件:显示一个矩形区域,用于布局美观
Label 标签控件:可以显示文本和位图
LabelFrame 简单的容器控件: 常用于复杂的窗口布局
Listbox 列表框控件:一个选项列表,用户可以从中选择
Menubutton 菜单按钮控件:显示菜单项
Menu 菜单控件:显示菜单栏,下拉菜单和弹出菜单
Message 消息控件:展示一些文字短消息,与Label类似,但更好
Radiobutton 单选按钮控件:显示一个单选的按钮
Scale 范围控件:显示一个数值刻度,为输出限定范围的数字区间
Scrollbar 滚动条控件:为方便查看超出可视化区域的内容
Text 文本控件:显示和处理多行文本
tkMessageBox 显示您应用程序的消息框
Toplevel 容器控件:显示和处理多行文本
Spinbox 输入控件:与Entry类似,但可以指定输入范围值
PanedWindow 窗口布局管理的插件:可以包含一个或者多个子控件

几何管理

Tkinter公开的几何管理类:包、网格、位置

几何方法 描述
pack() 包装
grid() 网格
place() 位置
  • pack是按添加顺序排列控件
  • grid是按行/列形式排列控件
  • place则可以指定控件大小和位置

pack

采用块的方式组织配件。

在快速生成界面设计中广泛采用,若干组件简单的布局,采用pack的代码量最少。

如果不指定pack的option参数,pack会从上到下的放置widget(控件)。

pack方法提供了以下的option选项,也就是可接受的参数:

参数名 描述 参数值
after 让你的控件在指定的控件之后pack 控件对象
anchor 确定放置的方向, 左=‘w’, 右=‘e’,顶=‘n’,底=‘s’,中=‘center’,可以组合 但必须小写 ‘n’, ‘s’, ‘e’, ‘w’, ‘nw’, ‘sw’, ‘se’, ‘ne’, ‘center’(默认为’center’)
before 让你的控件在指定的控件之前pack 控件对象
expand 当为True值时,随着父类控件大小增长,控件所在位置也会发生改变 True, ‘y’, ‘yes’, False, ‘n’, ‘no’,(不区分大小写)
fill 控件填充指定的方向 ‘x’, ‘y’, ‘both’
in_ 选定的控件包含本控件,即变成选定控件的子控件, 放在选定控件中 控件对象
ipadx, ipady 内部填充。控件内部在x(y)方向上填充的空间大小,默认单位为像素,可选单位为c(厘米)、m(毫米)、i(英寸)、p(打印机的点,即1/27英寸),用法为在值后加以上一个后缀既可 非负浮点数
padx, pady 外部填充。控件外部在x(y)方向上填充的空间大小,默认单位为像素,可选单位为c(厘米)、m(毫米)、i(英寸)、p(打印机的点,即1/27英寸),用法为在值后加以上一个后缀既可 非负浮点数
side 添加在父类控件的哪边 ‘top’, ‘bottom’, ‘left’, ‘right’

解答疑惑:side和anchor参数使用疑惑,expand效果疑惑

初学的时候,expand问题,side和anchor参数布局的问题疑惑了我很久,经过很长事件的摸索我才逐渐弄明白大概是怎么一回事,现在把它写下来。都是自己的感悟,也许思想上会有误区。

首先讲解一下参数anchor的布局:

anchor参数只能让控件一个一个地由上到下放置好,无法放置在其他控件旁边。

Python的GUI学习笔记——Tkinter笔记 【二】认识控件与几何管理Tkinter 控件几何管理

上图就是三个区域,控件一个个放进去,一个区域放一个控件。

然后anchor参数让控件在独自的区域类摆放位置或靠左或靠右等,区域的宽也许

大于控件的宽

,但一般

高等于控件的高

然后讲解一下参数side的布局:

side可以上下左右布局,但是呢,也如anchor一样一个区域只允许一个控件。具体介绍看图。

Python的GUI学习笔记——Tkinter笔记 【二】认识控件与几何管理Tkinter 控件几何管理

分为五个区域块,四边是side定义可安放的位置, 中间不放控件的话会自动合并在一起。side默认值为top。

Python的GUI学习笔记——Tkinter笔记 【二】认识控件与几何管理Tkinter 控件几何管理
  • 首先放置一个side='left’的控件,它会占据上图LEFT1的区域,于是该区域再也不能放其他控件了。
  • 第二个若是还放置side='left’控件的话,它会占据LEFT2,若是放side='right’则放在RIGHT1。
  • 占区域有个放置的优先顺序。空白区域不放其他的控件,就会省略掉。

如果放了四个区域,接着放side='top‘, side=‘bottom’, side=‘left’, side=‘right’, 那么就会如下:

Python的GUI学习笔记——Tkinter笔记 【二】认识控件与几何管理Tkinter 控件几何管理

那么会发现里面的左右区域比外面的四个小了很多。

说了这么多,就是想表明,对于side而言,占区域有个先后顺序。

import tkinter as tk


root = tk.Tk()

b1 = tk.Button(root, text='hello side b1')
b2 = tk.Button(root, text='hello side b2')
b3 = tk.Button(root, text='hello side b3')
b4 = tk.Button(root, text='hello side b4')

# 待插入代码

root.mainloop()

           

在带插入代码下插入以下代码:

b1.pack(side='top')
b2.pack(side='bottom')
b3.pack(side='left')
b4.pack(side='right')
           

再换代码段插入试试:

b1.pack(side='left')
b2.pack(side='right')
b3.pack(side='top')
b4.pack(side='bottom')
           

结果就是不一样,嗯,占区域有个先后顺序。

side与anchor参数总结:

那么现在就大致明白的side与anchor布局疑惑。

side控制摆放在四个方向的大致位置,然后anchor可以控制控件放置在区域内的某个位置。

一个区域只放一个控件。

对于expand参数。

当值为True时,即expand取True或’y’等,拉大窗口的话,

控件所在的区域就会被拉大

,控件是不会变化大小的,故而会发现控件间的距离似乎变大了。

而expand为False时(expand默认为False),

区域高度不会改变,但宽度会不断延伸

,上面提到过空白区域会自动省略,但是拉大窗口会多出空白区域。

测试代码如下:

import tkinter as tk


root = tk.Tk()

b1 = tk.Button(root, text='hello anchor b1')
b2 = tk.Button(root, text='hello anchor b2')
b3 = tk.Button(root, text='hello anchor b3')
b1.pack(expand='no', anchor='w')
b2.pack(expand='no', anchor = 'center')
b3.pack(expand='no', anchor = 'w')


root.mainloop()
           

会发现拉大窗口后,只有中间的按钮2在移动。

那是因为拉大窗口,按钮2所在的区域宽度在延伸,由于anchor为center故而不断放置在区域中央。

若是expand全设置为True,那么三个按钮位置都会随着窗口变大而变大,那是因为每个区域都开始变大。嗯,若果你把按钮1的anchor设置为’nw’的话会有不一样的体验与更深的理解。

expand参数总结:

如果为True,那么控件所在的区域会随父控件大小改变而改变。

否则为False,那么控件所在的区域的宽度会延伸但高度不会发生改变。

还是强调,一个区域只能放置一个控件。

pack类提供的方法

方法名 描述
forget() Unpack控件件,将控件隐藏并且忽略原有设置,对象依旧存在。
info() 返回一个列表, 包含pack提供的所有参数对应的值
propagate(bool) 传参为True,表示父控件的几何大小由子控件决定, 反之固定大小。
slaves() 返回一个列表, 包含所有该控件的所有子控件对象

使用方法就是,定义一个控件对象, pack后

对象名.方法名()

grid

采用类似表格的结构组织配件,使用起来非常灵活。

Grid(网格)布局管理器会将控件放置到一个二维的表格里。表格中的每个单元(cell)都可以放置一个控件。

grid方法提供了以下的option选项,也就是可接受的参数:

参数名 描述 参数值
column 控件放置在第几列单元格中 自然数(起始默认值为0)
columnspan 从控件所放置单元格算起,在列方向上的跨度。即列方向上的多个格子合并在一起,让后放一个控件 自然数(默认值为1)
in_ 选定的控件包含本控件,即变成选定控件的子控件, 放在选定控件中 控件对象
ipadx, ipady 内部填充。控件内部在x(y)方向上填充的空间大小,默认单位为像素,可选单位为c(厘米)、m(毫米)、i(英寸)、p(打印机的点,即1/27英寸),用法为在值后加以上一个后缀既可 非负浮点数
padx, pady 外部填充。控件外部在x(y)方向上填充的空间大小,默认单位为像素,可选单位为c(厘米)、m(毫米)、i(英寸)、p(打印机的点,即1/27英寸),用法为在值后加以上一个后缀既可 非负浮点数
row 控件放置在第几行单元格中 自然数(起始默认值为0)
rowspan 从控件所放置单元格算起,在行方向上的跨度。即行方向上的多个格子合并在一起,让后放一个控件 自然数(默认值为1)
sticky 如果单元格很大,控件会紧靠单元格的某一边界(与pack方法的anchor作用类似) ‘n’, ‘s’, ‘e’, ‘w’, ‘nw’, ‘sw’, ‘se’, ‘ne’, ‘center’(默认为’center’)

举个例子

以下代码展示了columnspan和sticky的效果。

import tkinter as tk


root = tk.Tk()

b1 = tk.Button(root, text='hello b1')
b2 = tk.Button(root, text='hello b2')
b3 = tk.Button(root, text='hello b3')
b4 = tk.Button(root, text='hello b4')

b1.grid(row=0, column=1)
b2.grid(row=1, column=1)
b3.grid(row=2, column=1)
b4.grid(row=1, column=2, rowspan=2, columnspan=2)
# 先测试代码,然后替换注释掉的b4, 再检查结果。
# b4.grid(row=1, column=2, rowspan=2, columnspan=2, sticky='nw')
root.mainloop()

           

grid类提供的方法

方法名 描述
bbox(column, row, col2, row2) Return a tuple of integer coordinates for the bounding box of this widget controlled by the geometry manager grid. If COLUMN, ROW is given the bounding box applies from the cell with row and column 0 to the specified cell. If COL2 and ROW2 are given the bounding box starts at that cell.The returned integers specify the offset of the upper left corner in the master widget and the width and height.
forget() 将控件隐藏并且忽略原有设置,对象依旧存在。
info() 返回一个列表, 包含grid提供的所有参数对应的值
location(x, y) Return a tuple of column and row which identify the cell at which the pixel at position X and Y inside the master widget is located.
propagate(bool) 传参为True,表示父控件的几何大小由子控件决定, 反之则固定大小。
size() Return a tuple of the number of column and rows in the grid.
slaves(row, column) 返回一个列表, 包含所有该控件的所有子控件对象

方法bbox,location和size不太清楚,有讲解似乎很明了的资料但是发现自己运行的代码却总不是不对劲。就暂且放一放,以后更新。

place

Place 布局管理可以显式的指定控件的绝对位置或相对于其他控件的位置。

place方法提供了以下的option选项,也就是可接受的参数:

参数名 描述 参数值
anchor 确定放置的方向 ‘n’, ‘s’, ‘e’, ‘w’, ‘nw’, ‘sw’, ‘se’, ‘ne’, ‘center’(默认为’center’)
bordermode 指定边框模式 ‘inside’, ‘outside’(默认值为’inside’)
height 控件的高度 非负浮点数
in_ 选定的控件包含本控件,即变成选定控件的子控件, 放在选定控件中 控件对象
relheight, relwidth 控件相对于父控件的高宽 0.0 - 1.0
relx, rely 控件相对于父控件的位置 0.0-1.0
width 控件的宽度 非负浮点数
x, y 控件的位置(像素),如果同时指定了relx/rely选项,优先实现relx/rely 非负浮点数

place类提供的方法

方法名 描述
forget() 将控件隐藏并且忽略原有设置,对象依旧存在。
info() 返回一个列表, 包含place提供的所有参数对应的值
slaves() 返回一个列表, 包含所有该控件的所有子控件对象

上一篇:窗口设置

下一篇:Label控件

继续阅读