GUI布局管理器

目录

前言

一、pack布局管理器

二、grid布局管理器

三、place布局管理器

前言

一个GUI应用程序必然有大量的组件，这些组件如何排布？这时候，就需要使用tkinter提供的布局管理器帮助我们组织、管理在父组件中子组件的布局方式。tkinter提供了三种管理器：pack、grid、place。

 一、pack布局管理器

pack按照组件的创建顺序将子组件添加到父组件中，按照垂直或者水平的方向自然排布。如果不指定任何选项，默认在父组件中自顶向下垂直添加组件。

pack是代码量最少，最简单的一种，可以用于快速生成界面。

pack()方法提供的选项

如上列出了pack布局所有的属性，但是不需要挨个熟悉，了解基本使用即可，pack适用于简单的垂直或水平分布，如果需要复杂的布局可以使用grid或place。

代码示例：

from tkinter import *
root = Tk();root.title("pack练习");root.geometry("300x300")
#Frame是一个矩形区域，可以用来放置其他子组件
f1=Frame(root,height=50);f1.pack();#垂直分布
btnText=['轻音乐','重金属','中国风']
for txt in btnText:
    Button(f1,text=txt).pack(side='left',padx=15)#水平分布
f2=Frame(root,height=250);f2.pack();#垂直分布
for i in range(0,15):
    if i%2==0:
        Label(f2,bg='black',height=250,width=2).pack(side='left')#水平分布
    else:
        Label(f2, bg='white', height=250, width=2).pack(side='left')  # 水平分布
root.mainloop()

运行结果：

二、grid布局管理器

grid表格布局，采用表格结构组织组件。子组件的位置由行和列的单元格来确定，并且可以跨行和跨列，从而实现复杂的布局。

grid()方法提供的选项

代码示例：

from tkinter import *
class Application(Frame):
    def __init__(self, master=None):
        Frame.__init__(self, master)
        self.master = master
        self.pack()
        self.createWidgets()
    def createWidgets(self):
        self.label01=Label(self,text="姓名：")
        self.label01.grid(row=0,column=0)
        self.entry01=Entry(self)
        self.entry01.grid(row=0,column=1,padx=10)
        self.label02=Label(self,text="电话：")
        self.label02.grid(row=1,column=0)
        self.entry02 = Entry(self)
        self.entry02.grid(row=1, column=1,padx=10)
        self.button01 = Button(self,text="确定")
        self.button01.grid(row=2,column=0,columnspan=2,sticky=EW)
root=Tk()
root.title("first blood")
root.geometry("300x300+300+300")
app = Application(master=root)
root.mainloop()

运行结果：

  三、place布局管理器

place布局管理器可以通过坐标精确控制组件的位置，适用于一些布局更加灵活的场景。

place()方法提供的选项

代码示例：

from tkinter import *
root=Tk();root.geometry("300x300");root.title("明朝皇帝")
frame=Frame(root,bg="yellow",height=200,width=200);frame.place(x=50,y=50)
Button(frame,text="朱元璋").place(relx=0.35,rely=0.3,relwidth=0.3,relheight=0.1)
Button(frame,text="朱标").place(relx=0.35,rely=0.65,relwidth=0.3,relheight=0.1)
root.mainloop();

运行结果：