frame组件+pack()来布局定位,比单独pack()容易多了

今天要讲解用frame组件+pack()来布局定位各个组件。在tkinter编程中,如果只是一,两个等少量组件在一个窗体上布局,那用pack()来布局也够了,但是如果组件多了,只是用pack()来布局就显示不够了,或者说,根本没有办法实现。

但是,用frame组件来帮助pack()布局就相对容易多了。因为frame是容器组件,可以收纳其它的组件,也可以收纳frame组件,我们可以根据实际情况下,先决定用几个frame组件,再决定frame如何排列,如果一个frame还无法解决它里面收纳的的组件的排列情况,可以这个frame里面再布局2个或多个frame来解决问题。

我们现在用1,2个例子来说明如何做到。下面的登录界面,大家一定见过很多次了,如果只是用pack()来布局来做一定不好做,但要是换成frame组件+pack()来做,就容易多了。

1.JPG

我们现在用3个frame来帮助布局,这3个frame(下图中的红框)从上到下排列。 姭嚞灬

2.JPG

我们先建立窗体代码,然后加入创建3个frame代码 (3个frame组件side停靠按默认的方式:从上到下),再把6个组件分别加入到3个frame组件里,(frame里的组件是side按从左到右排列)。先写代码运行看看结果,再根据结果调节组件间距,以及组件大小。我们一步步来做:

1.先建立一个窗体

from tkinter import *
root=Tk()
’这里准备加入新的代码
root.mainloop()

2.再创建3个frame 组件,先加入relief,bd参数用于显示frame,以便让大家看清楚框架的大小和位置,等界面都布局成功后,再把这个参数去除。

from tkinter import *
root=Tk()
fr1=Frame(root,relief='ridge',borderwidth=1) # 不设置边线宽,无法显示
fr1.pack()
fr2=Frame(root,relief='ridge',borderwidth=1) # 不设置边线宽,无法显示
fr2.pack()
fr3=Frame(root,relief='ridge',borderwidth=1) # 不设置边线宽,无法显示
fr3.pack()
’这里准备加入新的代码
root.mainloop()

3.把“用户名”标签,输入用户名的“文本框”加入框架fr1;把“密码”标签,输入密码的“文本框”加入框架fr2;

把“确定”和“取消”按钮,加入框架fr3。

由于现在还没有学习文本框和按钮组件,我现在全部用标签组件通过relief样式的改变来伪装成文本框和按钮。新加入的代码如下:

la1=Label(fr1,text='用户名:')
la1.pack(side='left')
la2=Label(fr1,text='',relief='sunken',bg='white',width='30')
la2.pack(side='left')

la3=Label(fr2,text='密 码:')
la3.pack(side='left')
la4=Label(fr2,text='',relief='sunken',bg='white',width='30')
la4.pack(side='left')

la5=Label(fr3,text='确定',relief='raised')
la5.pack(side='left')
la6=Label(fr3,text='取消',relief='raised')
la6.pack(side='left')

新手要注意:

标签1,2分别加入到fr1,所以,标签la1, la2 创建时的父组件是fr1,以此类推,标签3,4的父组件是fr2,标签5,6父组件是fr3。

标签2,4的背景颜色设置白色,样式为sunken凹形,模拟成文本框,框架里的各组件按从左到右排列,因为pack方法里的参数 side=left

我们运行看一下:

3.JPG

运行结果,各组件基本布局都到达各自的位置,但有一些问题:

  1. 3个frame的上下间距太小,应该适当增加;

  2. 3个frame 的左右端跟窗体边缘间距太小,也应该保持适当间距;

  3. “确定”和“取消”按钮,间距太小,自身宽度也太小,要改进。而且这2个按钮,应该向右移动适当距离。

改进方案:

  1. 三个frame的pack()里,用参数padx=10 来增加3个框架左右端跟窗体之间间距,用 pady=5 来增加3个框架之间以及跟窗体边缘的间距;

  2. 两个按钮,在pack()里,用参数 ipadx=30 增加它的宽度(也叫内边距),用padx=5 增加2个按钮之间的间距。

3. 让2个按钮整体右移,其实就是让fr3右移,所以:fr3.pack(padx=10,pady=5) # padx=10 表示左右都是10像素的间距

我们再改一下为:

fr3.pack(padx=(50,0),pady=5)  # padx=(50,0) 表示fr3左边外边距距为50个像素间距,右边为0像素

全部代码改成:   源码来自:wb98.com  欢迎访问

from tkinter import *
root=Tk()
fr1=Frame(root,relief='ridge',borderwidth=1) # 不设置边线宽,无法显示
fr1.pack(padx=10,pady=5)
fr2=Frame(root,relief='ridge',borderwidth=1) # 不设置边线宽,无法显示
fr2.pack(padx=10,pady=5)
fr3=Frame(root,relief='ridge',borderwidth=1) # 不设置边线宽,无法显示
fr3.pack(padx=(50,0),pady=5)

la1=Label(fr1,text='用户名:')
la1.pack(side='left')
la2=Label(fr1,text='',relief='sunken',bg='white',width='30')
la2.pack(side='left')

la3=Label(fr2,text='密 码:')
la3.pack(side='left')
la4=Label(fr2,text='',relief='sunken',bg='white',width='30')
la4.pack(side='left')

la5=Label(fr3,text='确定',relief='raised')
la5.pack(side='left',ipadx=30,padx=5)
la6=Label(fr3,text='取消',relief='raised')
la6.pack(side='left',ipadx=30,padx=5)

root.mainloop()

运行结果如下:

4.JPG

运行结果基本满意,合乎预期,最后要做的是,把3个框架的pack里 relief='ridge',borderwidth=1 去除,让框架边缘不再显示。

还有,你可以设置窗体的标题:root.title('登录')

你还可以设置窗体大小不可以鼠标调节尺寸:root.resizable(False,False)

全部代码如下:           wb98·com

from tkinter import *
root=Tk()
root.title('登录')
fr1=Frame(root) # 不设置边线宽,无法显示
fr1.pack(padx=10,pady=5)
fr2=Frame(root) # 不设置边线宽,无法显示
fr2.pack(padx=10,pady=5)
fr3=Frame(root) # 不设置边线宽,无法显示
fr3.pack(padx=(50,0),pady=5)

la1=Label(fr1,text='用户名:')
la1.pack(side='left')
la2=Label(fr1,text='',relief='sunken',bg='white',width='30')
la2.pack(side='left')

la3=Label(fr2,text='密 码:')
la3.pack(side='left')
la4=Label(fr2,text='',relief='sunken',bg='white',width='30')
la4.pack(side='left')

la5=Label(fr3,text='确定',relief='raised')
la5.pack(side='left',ipadx=30,padx=5)
la6=Label(fr3,text='取消',relief='raised')
la6.pack(side='left',ipadx=30,padx=5)

root.resizable(False,False)
root.mainloop()

运行结果如下:

5.JPG

小结一下:


对于组件多的窗体,为了简化组件的布局定位,可以创建适当数量的Frame组件来帮忙,Frame组件的pack()里,side='top' 或 side='bottom' 保持Frame组件纵向排列;

但对于Frame组件的子组件的pack()里,side='left' 或 side='right' 保持子组件按横向排列。

pack + frame 来布局窗体,定位组件就讲解到这,以后有机会,再结合实际例子来讲解。

此文章来自:wb98.com 网站上的系列课程文章,如要转载请保持链接。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,386评论 6 479
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,939评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,851评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,953评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,971评论 5 369
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,784评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,126评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,765评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,148评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,744评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,858评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,479评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,080评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,053评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,278评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,245评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,590评论 2 343

推荐阅读更多精彩内容

  • ![Flask](data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAW...
    极客学院Wiki阅读 7,229评论 0 3
  • 不知不觉易趣客已经在路上走了快一年了,感觉也该让更多朋友认识知道易趣客,所以就谢了这篇简介,已做创业记事。 易趣客...
    Physher阅读 3,407评论 1 2
  • 双胎妊娠有家族遗传倾向,随母系遗传。有研究表明,如果孕妇本人是双胎之一,她生双胎的机率为1/58;若孕妇的父亲或母...
    邺水芙蓉hibiscus阅读 3,695评论 0 2
  • 晴天,拥抱阳光,拥抱你。雨天,想念雨滴,想念你。 我可以喜欢你吗可以啊 我还可以喜欢你吗可以,可是你要知道我们不可...
    露薇霜凝阅读 1,202评论 1 2