tkinter的Frame布局

从头开始梳理：import tkinterif __name__ == '__main__':root = tkinter.Tk()root.geometry("300x300")root.mainloop()运行会得到一个300*300的小窗生成一个填充满整个窗口的Frame：关键参数是fill = 'both' 以及 expand = True ，在原来代码的基础上加上这两行frame_mas

Riven_h

8762人浏览 · 2021-06-03 19:25:06

Riven_h · 2021-06-03 19:25:06 发布

从头开始梳理：

import tkinter

if __name__ == '__main__':
    root = tkinter.Tk()
    root.geometry("300x300")
    root.mainloop()

运行会得到一个300*300的小窗

生成一个填充满整个窗口的Frame：

关键参数是fill = 'both' 以及 expand = True ，在原来代码的基础上加上这两行

    frame_masterA = tkinter.Frame(root, bg='blue')
    frame_masterA.pack(fill='both', ipadx=10, ipady=10, expand=True)

看下效果：

试着改变参数，将frame放置在窗口不同的地方，fill的参数有x, y, or both，上面代码其他不变的情况下fill参数变为fill = 'x'，效果如下：

fill = 'y'，效果如下：

完全不要fill参数，则效果为：

我们还可以用side参数，side参数有： top, bottom, left, right 分别对应上下左右

将frame放置在左边：

frame_masterA.pack(side='left',ipadx=10, ipady=10, expand=0)

expand参数需为0，如果为True，那么side='left'将不生效，仍然是上面图片那样

top, bottom, right 参数同理，这里不重复

如果想让frame沿Y轴填充满，可以和fill参数一起使用：

frame_masterA.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)

让frame在顶部沿X轴填充满：

frame_masterA.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)

side的其他两个：right和bottom同理

以下是布局多个frame的情况：

import tkinter

if __name__ == '__main__':
    root = tkinter.Tk()
    root.geometry("300x300")

    frame_masterA = tkinter.Frame(root, bg='blue')
    frame_masterA.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
    frame_masterB = tkinter.Frame(root, bg='green')
    frame_masterB.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)

    root.mainloop()

加了一个布局一样的frame ，side和fill参数相对于第一个都没有改变，为了便于区分把背景换成绿色，效果如下：

如果想第2个frame填充满整个剩下的区域可以这两个参数改一下：fill='both'， expand=True，

side不变

frame_masterB.pack(side='top',fill='both',ipadx=10, ipady=10, expand=True)

效果如图：

如果想改变这两个frame所占的高度，可以在生成frame对象的时候指定高度，比如这里令第一个frame的 height=130

frame_masterA = tkinter.Frame(root, height=130, bg='blue')
frame_masterA.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
frame_masterB = tkinter.Frame(root, bg='green')
frame_masterB.pack(side='top',fill='both',ipadx=10, ipady=10, expand=True)

效果为：

frame_masterA = tkinter.Frame(root, width=130, bg='blue')
frame_masterA.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)
frame_masterB = tkinter.Frame(root, bg='green')
frame_masterB.pack(side='left',fill='both',ipadx=10, ipady=10, expand=True)

效果为：

试下三个frame的情况：

frame_masterA = tkinter.Frame(root, width=130, bg='blue')
frame_masterA.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)
frame_masterB = tkinter.Frame(root, width=50, bg='green')
frame_masterB.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)
frame_masterC = tkinter.Frame(root, bg='yellow')
frame_masterC.pack(side='left',fill='both',ipadx=10, ipady=10, expand=True)

效果：

横着排列的情况：

frame_masterA = tkinter.Frame(root, height=130, bg='blue')
frame_masterA.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
frame_masterB = tkinter.Frame(root, height=50, bg='green')
frame_masterB.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
frame_masterC = tkinter.Frame(root, bg='yellow')
frame_masterC.pack(side='top',fill='both',ipadx=10, ipady=10, expand=True)

效果：

接下来是多层frame的情况，多个frame放置在一个frame上面，视觉效果上达到将frame切分的效果，这里以蓝色为底部frame，添加创建红色和灰色frame：

frame_masterD = tkinter.Frame(frame_masterA, height=130, bg='red')
frame_masterD.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)
frame_masterE = tkinter.Frame(frame_masterA, height=130, bg='gray')
frame_masterE.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)

这里有两个要注意的参数，创建Frame的时候第一个参数已经不是一开始的root，而变成了frame_masterA ，还赋值了高度，如果不赋值，会是初始默认高度，蓝色的frame_masterA 会跟着红灰frame的高度一起改变

效果：

继续在frame_masterA 剩余蓝色的空间上划分空间，这次横着划分，加上这两个frame:

frame_masterF = tkinter.Frame(frame_masterA, width=50, bg='pink')
frame_masterF.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
frame_masterG = tkinter.Frame(frame_masterA, width=50, bg='white')
frame_masterG.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)

效果：

在A剩余的蓝色空间上放置其他的组件：

model_Frame1 = tkinter.Frame(frame_masterA) #或者在其他frame上放置，这里就改成那个frame
model_Frame1.pack(side='left')

group =tkinter.LabelFrame(model_Frame1, text="连接设备", font=("黑体", 10))
group.place(x=10, y=10)
group.grid(row=0, column=0, padx=10, pady=10)

g1_lable1 = tkinter.Label(group, text="串口号:", font=("黑体", 10))
g1_lable1.grid(row=0, column=0, padx=2, pady=10)

g1_lable2 = tkinter.Label(group, text="波特率:", font=("黑体", 10))
g1_lable2.grid(row=0, column=3, padx=2, pady=5)

效果：

完整代码：

# -*- coding: utf-8 -*-
import tkinter

if __name__ == '__main__':
    root = tkinter.Tk()
    root.geometry("300x300")

    frame_masterA = tkinter.Frame(root, height=130, bg='blue')
    frame_masterA.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
    frame_masterB = tkinter.Frame(root, height=50, bg='green')
    frame_masterB.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
    frame_masterC = tkinter.Frame(root, bg='yellow')
    frame_masterC.pack(side='top',fill='both',ipadx=10, ipady=10, expand=True)

    frame_masterD = tkinter.Frame(frame_masterA, height=130, bg='red')
    frame_masterD.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)
    frame_masterE = tkinter.Frame(frame_masterA, height=130, bg='gray')
    frame_masterE.pack(side='left',fill='y',ipadx=10, ipady=10, expand=0)

    frame_masterF = tkinter.Frame(frame_masterA, width=50, bg='pink')
    frame_masterF.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)
    frame_masterG = tkinter.Frame(frame_masterA, width=50, bg='white')
    frame_masterG.pack(side='top',fill='x',ipadx=10, ipady=10, expand=0)

    model_Frame1 = tkinter.Frame(frame_masterA)
    model_Frame1.pack(side='left')

    group =tkinter.LabelFrame(model_Frame1, text="连接设备", font=("黑体", 10))
    group.place(x=10, y=10)
    group.grid(row=0, column=0, padx=10, pady=10)

    g1_lable1 = tkinter.Label(group, text="串口号:", font=("黑体", 10))
    g1_lable1.grid(row=0, column=0, padx=2, pady=10)

    g1_lable2 = tkinter.Label(group, text="波特率:", font=("黑体", 10))
    g1_lable2.grid(row=0, column=3, padx=2, pady=5)

    root.mainloop()