当前位置:   article > 正文

【tkinter学习笔记 - 5】:布局管理器(grid、pack、place)_tk grid place

tk grid place

目录

一、grid布局管理器

grid()方法提供的选项

通过grid布局-实现计算器软件界面

二、pack布局管理器

pack()方法提供的几个重要选项 

pack布局--制作钢琴按钮

三、place布局管理器 

place()方法的选项 


一、grid布局管理器

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

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

grid()方法提供的选项

选项说明取值范围
column单元格的列号从0开始的正整数
columnspan跨列、跨越的列数正整数
row单元格的行号从0开始的正整数
rowspan跨行、跨越的列数正整数
ipadx、ipady设置子组件之间的间隔,x方向或者y方向,默认单位为像素 非浮点数,默认0.0
padx、pady与之并列的组件之间的间隔,x方向或者y方向,默认单位为像素非浮点数,默认0.0
sticky组件紧贴所在单元格的某一角,对应于东南西北种以及四个角

"N"、"S"、"W"、"E"、"NW"、

"SW"、"SE"、"NE"、"center"(默认)

代码演示

  1. from tkinter import *
  2. import tkinter as tk
  3. class Application(tk.Frame):
  4. def __init__(self, master=None):
  5. tk.Frame.__init__(self,master)
  6. self.master = master
  7. self.pack()
  8. self.createWidget()
  9. def createWidget(self):
  10. '''通过grid布局实现登录界面'''
  11. self.label01 = Label(self, text='用户名')
  12. self.label01.grid(row=0, column=0)
  13. self.entry01 = Entry(self)
  14. self.entry01.grid(row=0, column=1)
  15. Label(self, text='用户名为手机号').grid(row=0, column=2)
  16. Label(self, text='密码').grid(row=1, column=0)
  17. Entry(self, show='*').grid(row=1, column=1)
  18. Button(self, text='登录').grid(row=2, column=1, stick=EW)
  19. Button(self, text='取消').grid(row=2, column=2, stick=E)
  20. if __name__ == '__main__':
  21. root = Tk()
  22. root.geometry('300x100+200+300')
  23. root.title('登录系统')
  24. app = Application(root)
  25. root.mainloop()
  •  运行结果

通过grid布局-实现计算器软件界面

  1. from tkinter import *
  2. import tkinter as tk
  3. class Application(tk.Frame):
  4. def __init__(self, master=None):
  5. tk.Frame.__init__(self, master)
  6. self.master = master
  7. self.pack()
  8. self.createWidget()
  9. def createWidget(self):
  10. '''通过grid布局实现计算器的界面'''
  11. btnText = (('MC', 'M+','M-','MR'),
  12. ('C', '±', '÷', '×'),
  13. (7, 8, 9, '-'),
  14. (4, 5, 6, '+'),
  15. (1, 2, 3, '='),
  16. (0, '.'),
  17. )
  18. Entry(self).grid(row=0, column=0, columnspan=4, pady=10)
  19. for rindex,r in enumerate(btnText):
  20. for cindex,c in enumerate(r):
  21. if c == '=':
  22. Button(self, text=c, width=2).grid(row=rindex + 1, column=cindex, rowspan=2, sticky=NSEW)
  23. elif c == 0:
  24. Button(self, text=c, width=2).grid(row=rindex + 1, column=cindex, columnspan=2, sticky=NSEW)
  25. elif c == '.':
  26. Button(self, text=c, width=2).grid(row=rindex + 1, column=cindex+1, rowspan=2, sticky=NSEW)
  27. else:
  28. Button(self, text=c, width=2).grid(row=rindex+1, column=cindex, sticky=NSEW)
  29. if __name__ == '__main__':
  30. root = Tk()
  31. root.title('计算器界面')
  32. root.geometry('200x230+200+300')
  33. app = Application(root)
  34. root.mainloop()
  •  运行结果


二、pack布局管理器

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

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

pack()方法提供的几个重要选项 

名称描述数值范围
fill填充x(y)方向上的空间,当属性side=“top”或“bottom”时,填充x方向;当属性side=“left”或“right”时填充y方向;当expend选项为“yes”时,填充父组件的剩余空间“x”、“y”、“both”、“none”(默认值为none)
ipadx、ipady设置子组件之间的间隔,x方向或者y方向,默认单位为像素 非浮点数,默认0.0
padx、pady与之并列的组件之间的间隔,x方向或者y方向,默认单位为像素非浮点数,默认0.0
side定义停留在父组件的哪一边“top”、“bottom”、“left”、“right”(默认值为“top”)
anchor对齐方式,左对齐“w”,右对齐“e”、顶对齐“n”、低对齐“s”“N”、“S”、“W”、“E”、“NW”、“SW”、“SE”、“NE”、“center”(默认)

pack布局--制作钢琴按钮

  1. from tkinter import *
  2. root = Tk()
  3. root.geometry('700x220')
  4. root.title('钢琴按键')
  5. # Frame是一个矩形区域,就是用来放置其他子组件
  6. f1 = Frame(root)
  7. f1.pack()
  8. f2 = Frame(root)
  9. f2.pack()
  10. btnText = ('流行风','中国风','日本风','重金属','轻音乐')
  11. for txt in btnText:
  12. Button(f1, text=txt).pack(side='left', padx=10)
  13. for i in range(1,13):
  14. Button(f2, width=5, height=10, borderwidth=1, relief='solid',
  15. bg='black' if i%2==0 else 'white').pack(side='left', padx=2)
  16. root.mainloop()
  •  运行结果


三、place布局管理器 

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

place()方法的选项 

选项说明取值范围
x、y组件左上角的绝对坐标(相对于窗口)

非负整数

x和y选项用于设置偏移(像素),如果同时设置 relx(rely) 和 x(y) 那么place将优先计算relx和rely,然后再实现x和y指定的偏移值 

relx、rely组件左上角的坐标(相对于父容器)

relx是相对于父组件的位置,0是最左边,0.5是正中间,1是最右边;

rely是相对于父组件的位置,0是最左边,0.5是正中间,1是最右边;

width、height组件的宽度和高度非负数
rewidth、reheight组建的宽度和高度与relx、rely取值类似,但是相对于父组件的尺寸
anchor对齐方式,左对齐“w”,右对齐“e”、顶对齐“n”、低对齐“s”“N”、“S”、“W”、“E”、“NW”、“SW”、“SE”、“NE”、“center”(默认)

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/在线问答5/article/detail/778743
推荐阅读
相关标签
  

闽ICP备14008679号