TKinter-Python GUI编程第十八课、Tkinter布局管理控件

除了上一节《Tkinter布局管理方法》中提到的三个常用方法外，Tkinter  还提供了几个常用的布局管理控件，比如 Frame 、LabelFrame 等，这些控件的主要作用是为其他控件提供载体，并将主窗口界面划分成多个区域，从而方便开发者对不同区域进行设计与管理。

在前文讲解其他的 Tkinter 控件时，我们列举的大多数示例都是将控件直接放置在主窗口（即根窗口）内，这样做的目的是为了便于大家理解。但在实际的开发过程中，控件一般放置在容器中，比如 Frame 容器控件，如同 HTML 中的<div>标签一样，把容器看做成一个框架，其他控件则是这个框架中的“元素”。

本节介绍了四种常用的容器控件以及它们的使用方法，分别是 Frame、LabelFrame、PanedWindow 以及 Toplevel。

Frame控件

Frame 本质上也是一个矩形窗体，同其他控件一样也需要位于主窗口内。我们可以在主窗口内放置多个 Frame 控件，并且每个 Frame 中还可以嵌套一个或者多个Frame，从而将主窗口界面划分成多个区域。

Frame 控件的常用属性如下表所示：

下面看一组简单的示例，通过 Frame 将主窗口分成左右两个部分，如下所示：

import tkinter as tk

win = tk.Tk()
win.title("C语言中文网")
win.geometry('400x350+200+200')
win.iconbitmap('C:/Users/Administrator/Desktop/C语言中文网logo.ico')

# 在主窗口上添加一个frame控件
frame1 = tk.Frame(win)
frame1.pack()

# 在frame_1上添加另外两个frame， 一个在靠左，一个靠右
#左侧的frame
frame_left = tk.Frame(frame1)
tk.Label(frame_left,text='左侧标签1',bg='green',width=10,height=5).grid(row =0,column=0)
tk.Label(frame_left,text='左侧标签2',bg='blue',width=10,height=5).grid(row = 1 ,column =1)
frame_left.pack(side=tk.LEFT)

frame_right = tk.Frame(frame1)
tk.Label(frame_right,text='右侧标签1',bg='gray',width=10,height=5).grid(row = 0 ,column =1)
tk.Label(frame_right,text='右侧标签2',bg='pink',width=10,height=5).grid(row = 1 ,column =0)
tk.Label(frame_right,text='右侧标签3',bg='purple',width=10,height=5).grid(row= 1,column=1)
frame_right.pack(side=tk.RIGHT)
win.mainloop()

程序运行结果：

图1：Frame控件布局管理

上述示例利用 Frame 控件将主窗口分成了左右两个子区域，同时在各自区域中添加了 Label 标签，而且区域之间互不干扰。采用这种分区、分块的布局方式，可以使得 GUI 程序更加规范、简洁化。

LabelFrame控件

LabelFrame 控件也是一种容器类型的控件，它属于是 Frame 控件的变体，因此它们的属性选项大体相同。

在默认情况下，LabelFrame 会在其包裹的子组件周围绘制一个边框和一个标题。当我们想要将一些相关的组件分为一组时，就可以使用 LabelFrame 组件，比如把一系列 Radiobutton（单选按钮）放在一起来供用户选择。

同 Frame 控件一样，LabelFrame 的主要作用也是对控件进行分组处理，下面看一个具体的实例：

import tkinter as tk

win = tk.Tk()
win.title("C语言中文网")
win.geometry('800x350+200+200')
win.iconbitmap('C:/Users/Administrator/Desktop/C语言中文网logo.ico')

# 定义第一个容器，使用 labelanchor ='w' 来设置标题的方位
frame_left = tk.LabelFrame(win, text="教程", labelanchor="w",bg='#5CACEE')
# 使用 place 控制 LabelFrame 的位置
frame_left.place(relx=0.2, rely=0.2, relwidth=0.2, relheight=0.5)

label_1 = tk.Label(frame_left, text="C语言")
label_1.place(relx=0.2, rely=0.2)

label_2 = tk.Label(frame_left, text="Python")
label_2.place(relx=0.6, rely=0.2)

label_3 = tk.Label(frame_left, text="Java")
label_3.place(relx=0.2, rely=0.6)

label_4 = tk.Label(frame_left, text="C++")
label_4.place(relx=0.6, rely=0.6)

# 定义第二个容器，使用 labelanchor ='w' 来设置标题的方位
frame_right = tk.LabelFrame(win, text="辅导班", labelanchor="w",bg='#66CDAA')
# 使用 place 控制 LabelFrame 的位置
frame_right.place(relx=0.5, rely=0.2, relwidth=0.3, relheight=0.6)
label_1 = tk.Label(frame_right, text="C语言辅导班")
label_1.place(relx=0.2, rely=0.2)

label_2 = tk.Label(frame_right, text="数据结构")
label_2.place(relx=0.6, rely=0.2)

label_3 = tk.Label(frame_right, text="C++辅导班")
label_3.place(relx=0.2, rely=0.6)

label_4 = tk.Label(frame_right, text="Python答疑")
label_4.place(relx=0.6, rely=0.6)
win.mainloop()

程序运行结果：

图2：LabelFrame容器控件

PanedWindow控件

PanedWindow（窗格界面）也可以理解成一个特殊的 Frame 控件，它是 Tkinter 8.4 版本后新增的空间管理组件，其主要目的是为其他组件提供一个容器或者框架，从而实现以分块的形式对图形界面进行布局。

与 Frame 控件不同， PanedWindow 允许用户自主地调整界面划分以及每块区域的大小。因此，当您需要让用户自己调节每块区域的大小时，就可以采用 PanedWindow 作为组件载体来进行界面的布局。

不仅如此 PanedWindow 组件还提供了“手柄” 功能（设置参数 showhandle=True 来启用），通过拖动“手柄”图标也可以改变每块区域的大小。PanedWindow 组件语法格式如下所示：

PanedWindow(master=None, **options)

其中 master 表示父组件，即包裹该组件的上层组件。其常用属性如下表所示：

PanedWindow 的常用方法如下表所示：

下面示例设计一个简单的界面布局，然后将图形界面分割成四部分：创建一个水平方向的 PanedWindow，并向其中添加两个 Label 组件，之后创建一个垂直的方向的 PanedWindow，并向其中中添加两个 Label 标签。示例代码如下：

import tkinter as tk


win = tk.Tk()
win.title("C语言中文网")
win.geometry('400x400+200+200')
win.iconbitmap('C:/Users/Administrator/Desktop/C语言中文网logo.ico')


# 创建一个水平方向的 panedwindow，并添加到主窗口中，默认为水平方向
p_window1 = tk.PanedWindow(win)
p_window1.pack(fill=tk.BOTH, expand=1)
# 在窗口区的左侧添加两个水平方向的 Label
left1 =tk. Label(p_window1, text='C语言中文网', bg='#7CCD7C', width=10,font=('微软雅黑',15))
p_window1.add(left1)
left2 =tk.Label(p_window1, text='网址：c.biancheng.net', bg='#9AC0CD', width=10,font=('微软雅黑',15))
p_window1.add(left2)

# 创建一个垂直方向的panedwindow,并添加一个手柄，设置分割线样式
p_window2 = tk.PanedWindow(orient=tk.VERTICAL,showhandle=True,sashrelief='sunken')
# 添加到 p_window1中
p_window1.add(p_window2)
# 在 p_window2 中添加两个垂直方向的标签
top_label =tk. Label(p_window2, text='教程', bg='#7171C6', height=8,font=('宋体',15))
p_window2.add(top_label)
bottom_label =tk. Label(p_window2, text='辅导班', bg='#8968CD',font=('宋体',15))
p_window2.add(bottom_label)

win.mainloop()

程序运行结果：

图3：PanedWindow空间布局

注意：从上述示例中可以看出 PanedWindw 会为每一个 Label 控件创建一个独立的窗格， 当我们将鼠标悬停在两个控件接壤处的白色边框上时，就会出现可以上下或者左右拉伸的指示光标，用户按照可以按照自己的意愿来调整每块区域的大小。

Toplevel控件

Topleve 是一个顶级窗口控件（也被称为“子窗体”控件），同样类似于 Frame 控件， 不过该控件会脱离根窗口另行创建一个独立窗口，因此它的存在形式不同于上述其他容器。

Toplevel 控件同样隶属于主窗口的子组件，只是存在形式特殊而已。Toplevel 是主窗口之外的弹出框窗口（通过事件来触发执行），在这个窗口内也可以包含其他组件。但需要注意，顶级窗口并不是必须位于窗口的顶部位置，之所以称其为顶级窗口，是因为相对于主窗口而言，Topleve 位于主窗口的上一层。

Toplevel 控件拥有根窗口控件的所有方法和属性，同时它还拥有一些独有的方法，如下表所示：

下面看一组关于创建 Toplevel 的示例，如下所示：

import tkinter as tk

root = tk.Tk()
root.config(bg='#87CEEB')
root.title("C语言中文网")
root.geometry('400x350+300+300')
root.iconbitmap('C:/Users/Administrator/Desktop/C语言中文网logo.ico')

def create_toplevel():
    top = tk.Toplevel()
    top.title("C语言中文网")
    top.geometry('300x200+100+100')
    top.iconbitmap('C:/Users/Administrator/Desktop/C语言中文网logo.ico')
    # 多行文本显示Message控件
    msg = tk.Label(top, text="网址：c.biancheng.net",bg='#9BCD9B',font=('宋体',15))
    msg.pack()

tk.Button(root, text="点击创建Toplevel组件", width=20,height=3,command=create_toplevel).pack()
root.mainloop()

程序的运行结果如下：

图4：Toplevel组件创建顶级窗口