摘要：已獲原作者授權(quán)原系列地址簡(jiǎn)介本文講述如何使用的布局管理被稱作或有三種布局管理方式注意這三種布局管理在同一個(gè)里一定不可以混用布局管理有以下功能將控件放置在屏幕上包括控件的位置及控件的大小將控件注冊(cè)到本地窗口系統(tǒng)中管理控件在屏幕上的顯示雖然控件

已獲原作者授權(quán). 原系列地址: Python Tkinter

本文講述如何使用 tkinter 的布局管理 (被稱作 layout managers 或 geometry managers). tkinter 有三種布局管理方式:

pack

grid

place

注意這三種布局管理在同一個(gè) master window 里一定不可以混用! 布局管理有以下功能:

將控件放置在屏幕上,包括控件的位置及控件的大小

將控件注冊(cè)到本地窗口系統(tǒng)中

管理控件在屏幕上的顯示

雖然控件自己也可以指定大小和對(duì)齊方式等信息, 但最終的控件大小及位置還是由布局管理決定的.

pack 是三種布局管理中最常用的. 另外兩種布局需要精確指定控件具體的顯示位置, 而 pack 布局可以指定相對(duì)位置, 精確的位置會(huì)由 pack 系統(tǒng)自動(dòng)完成. 這也使得 pack 布局沒有另外兩種布局方式靈活. 所以 pack 是簡(jiǎn)單應(yīng)用的首選布局, 比如只是想要將控件水平或垂直的逐個(gè)放在一起:

from Tkinter import *

root = Tk()
Label(root, text="Red Sun", bg="red", fg="white").pack()
Label(root, text="Green Grass", bg="green", fg="black").pack()
Label(root, text="Blue Sky", bg="blue", fg="white").pack()
mainloop()

下面將逐一講解 pack 布局的各個(gè)屬性.

在上面那個(gè)例子里, 我們簡(jiǎn)單的將三個(gè) Label 控件 pack 到其父窗口上, 沒有使用任何屬性. 于是 pack 使用了默認(rèn)方式進(jìn)行布局: 從上到下順次排放, 并水平居中. 同時(shí)我們也發(fā)現(xiàn), pack 默認(rèn)會(huì)將 Label 控件的寬度設(shè)置為其中的文字的寬度. 如果我們想讓它們和其父窗口一樣寬, 可以使用 fill=X 屬性:

from Tkinter import *

root = Tk()
w = Label(root, text="Red Sun", bg="red", fg="white")
w.pack(fill=X)
w = Label(root, text="Green Grass", bg="green", fg="black")
w.pack(fill=X)
w = Label(root, text="Blue Sky", bg="blue", fg="white")
w.pack(fill=X)
mainloop()

Pack 可以在四個(gè)方面控制控件邊距: 內(nèi)邊距, 外邊距, 水平邊距, 垂直邊距:

padx - 設(shè)置水平方向的外邊距

from Tkinter import *

root = Tk()
w = Label(root, text="Red Sun", bg="red", fg="white")
w.pack(fill=X,padx=10)
w = Label(root, text="Green Grass", bg="green", fg="black")
w.pack(fill=X,padx=10)
w = Label(root, text="Blue Sky", bg="blue", fg="white")
w.pack(fill=X,padx=10)
mainloop()

pady - 設(shè)置豎直方向的外邊距

from Tkinter import *

root = Tk()
w = Label(root, text="Red Sun", bg="red", fg="white")
w.pack(fill=X,pady=10)
w = Label(root, text="Green Grass", bg="green", fg="black")
w.pack(fill=X,pady=10)
w = Label(root, text="Blue Sky", bg="blue", fg="white")
w.pack(fill=X,pady=10)
mainloop()

ipadx - 設(shè)置水平方向的內(nèi)邊距

from Tkinter import *

root = Tk()
w = Label(root, text="Red Sun", bg="red", fg="white")
w.pack()
w = Label(root, text="Green Grass", bg="green", fg="black")
w.pack(ipadx=10)
w = Label(root, text="Blue Sky", bg="blue", fg="white")
w.pack()
mainloop()

ipady - 設(shè)置豎直方向的內(nèi)邊距

from Tkinter import *

root = Tk()
w = Label(root, text="Red Sun", bg="red", fg="white")
w.pack()
w = Label(root, text="Green Grass", bg="green", fg="black")
w.pack(ipadx=10)
w = Label(root, text="Blue Sky", bg="blue", fg="white")
w.pack(ipady=10)
mainloop()

上述四個(gè)屬性的默認(rèn)值都是 0.

我們把上面那幾個(gè) Label 從左到右放在一排:

from Tkinter import *

root = Tk()
w = Label(root, text="red", bg="red", fg="white")
w.pack(padx=5, pady=10, side=LEFT)
w = Label(root, text="green", bg="green", fg="black")
w.pack(padx=5, pady=20, side=LEFT)
w = Label(root, text="blue", bg="blue", fg="white")
w.pack(padx=5, pady=20, side=LEFT)
mainloop()

如果把上述 side 屬性的值都改為 RIGHT, 那么上面 Label 控件的排列順序就反過來了:

Place 布局管理可以顯式的指定控件的絕對(duì)位置或相對(duì)于其他控件的位置. 要使用 Place 布局, 調(diào)用相應(yīng)控件的 place() 方法就可以了. 所有 tkinter 的標(biāo)準(zhǔn)控件都可以調(diào)用 place() 方法.

下面是一個(gè)使用 Place 布局的例子: 為 Label 控件設(shè)置隨機(jī)的背景色, 然后計(jì)算各個(gè) Label 的背景色的亮度(灰度值), 如果其亮度小于 120, 則將其前景色(文字顏色, fg 屬性)設(shè)置為白色, 否則設(shè)為黑色. 這樣做是為了避免使背景色和前景色過于接近而導(dǎo)致文字不易閱讀.

import Tkinter as tk
import random

root = tk.Tk()
# width x height + x_offset + y_offset:
root.geometry("170x200+30+30") 

languages = ["Python","Perl","C++","Java","Tcl/Tk"]
labels = range(5)
for i in range(5):
   ct = [random.randrange(256) for x in range(3)]
   brightness = int(round(0.299*ct[0] + 0.587*ct[1] + 0.114*ct[2]))
   ct_hex = "%02x%02x%02x" % tuple(ct)
   bg_colour = "#" + "".join(ct_hex)
   l = tk.Label(root, 
                text=languages[i], 
                fg="White" if brightness < 120 else "Black", 
                bg=bg_colour)
   l.place(x = 20, y = 30 + i*30, width=120, height=25)

root.mainloop()

Pack 作為首選的布局管理方式, 其運(yùn)作方式并不是特別易于理解. 已經(jīng)由 Pack 布局完成的設(shè)計(jì)也很難做出改變. Grid 布局在1996年作為另一種可供選擇的布局方式被引入. Grid 布局方式易學(xué)易用, 但似乎大家還是習(xí)慣用 Pack.

Grid 在很多場(chǎng)景下是最好用的布局方式. 相比而言, Pack 布局在控制細(xì)節(jié)方面有些力不從心. Place 布局雖然可以完全控制控件位置, 但這也導(dǎo)致使用 Place 會(huì)比其他兩種布局方式更加復(fù)雜.

Grid 把控件位置作為一個(gè)二維表結(jié)構(gòu)來維護(hù), 即按照行列的方式排列控件: 控件位置由其所在的行號(hào)和列號(hào)決定. 行號(hào)相同而列號(hào)不同的幾個(gè)控件會(huì)被彼此上下排列; 列號(hào)相同而行號(hào)不同的幾個(gè)控件會(huì)被彼此左右排列.

使用 Grid 布局的過程就是為各個(gè)控件指定行號(hào)和列號(hào)的過程. 不需要為每個(gè)格子指定大小, Grid 布局會(huì)自動(dòng)設(shè)置一個(gè)合適的大小.

下面還是舉個(gè)栗子吧:

from Tkinter import *

colours = ["red","green","orange","white","yellow","blue"]

r = 0
for c in colours:
    Label(text=c, relief=RIDGE,width=15).grid(row=r,column=0)
    Entry(bg=c, relief=SUNKEN,width=10).grid(row=r,column=1)
    r = r + 1

mainloop()

全系列:
[譯][Tkinter 教程01] 入門: Label 控件
[譯][Tkinter 教程02] Message 控件
[譯][Tkinter 教程03] Button 控件
[譯][Tkinter 教程04] Variable 類
[譯][Tinkter 教程05] Radiobutton 控件
[譯][Tkinter 教程06] Checkbox 控件
[譯][Tkinter 教程07] Entry 控件
[譯][Tkinter 教程08] Canvas 圖形繪制
[譯][Tkinter 教程09] Scale 控件
[譯][Tkinter 教程10] Text 控件
[譯][Tkinter 教程11] 對(duì)話框和消息框
[譯][Tkinter 教程12] 布局管理 (Pack Place Grid)
[譯][Tkinter 教程13] Mastermind 游戲
[譯][Tkinter 教程14] menu 菜單
[譯][Tkinter 教程15] event 事件綁定

譯者水平有限, 如有疏漏, 歡迎指正.
已獲得原作者授權(quán). 原文地址:
Layout Management