Python之tkinter 窗口控件配置管理員之grid方法

簡介

在設計GUI程序時，可以使用三種方法包裝和定位各組件在容器或窗口內的位置
這三種方法又稱窗口控件配置管理員(Widget Layout Manager)

• pack 方法
• grid 方法
• place 方法

grid方法

這是一種以格狀或者類似Excel電子表格方式包裝和定位窗口組件的方法。

語法如下：

grid(options, ...)

它的參數有row, column, padx/pady, rowspan, columnspan, sticky

row 和 column

例子：使用grid()方法替代pack()方法重新設計

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One",
                      bg="lightyellow",
                       width=15)
label2 = tkinter.Label(root, text="Two",
                      bg="lightblue",
                       width=15)
label3 = tkinter.Label(root, text="Three",
                      bg="lightgreen",
                       width=15)
label1.grid(row=0, column=0)
label2.grid(row=0, column=1)
label3.grid(row=1, column=0)
root.mainloop()

運行結果：

例子：

label1.grid(row=0, column=0)
label2.grid(row=2, column=1)
label3.grid(row=1, column=2)

運行結果：

columnspan 參數

可以設定控件在column方向的合併數量

我們先用grid()方法建立一個含有8個標籤的應用

例子：

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One", relief="raised", width=5)
label2 = tkinter.Label(root, text="Two", relief="raised", width=5)
label3 = tkinter.Label(root, text="Three", relief="raised", width=5)
label4 = tkinter.Label(root, text="Four", relief="raised", width=5)
label5 = tkinter.Label(root, text="Five", relief="raised", width=5)
label6 = tkinter.Label(root, text="Six", relief="raised", width=5)
label7 = tkinter.Label(root, text="Seven", relief="raised", width=5)
label8 = tkinter.Label(root, text="Eight", relief="raised", width=5)
label1.grid(row=0, column=0)
label2.grid(row=0, column=1)
label3.grid(row=0, column=2)
label4.grid(row=0, column=3)
label5.grid(row=1, column=0)
label6.grid(row=1, column=1)
label7.grid(row=1, column=2)
label8.grid(row=1, column=3)
root.mainloop()

運行結果：

現在我們想把二和三給重合，就要用到columnspan參數
例子：

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One", relief="raised", width=5)
# 注意，這裏修改了寬度爲10像素
label2 = tkinter.Label(root, text="Two", relief="raised", width=10)
# label3 = tkinter.Label(root, text="Three", relief="raised", width=5)
label4 = tkinter.Label(root, text="Four", relief="raised", width=5)
label5 = tkinter.Label(root, text="Five", relief="raised", width=5)
label6 = tkinter.Label(root, text="Six", relief="raised", width=5)
label7 = tkinter.Label(root, text="Seven", relief="raised", width=5)
label8 = tkinter.Label(root, text="Eight", relief="raised", width=5)
label1.grid(row=0, column=0)
label2.grid(row=0, column=1, columnspan=2)
# label3.grid(row=0, column=2)
label4.grid(row=0, column=3)
label5.grid(row=1, column=0)
label6.grid(row=1, column=1)
label7.grid(row=1, column=2)
label8.grid(row=1, column=3)
root.mainloop()

運行結果：

rowspan 參數

可以設定控件在row方向的合併數量

例子：

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One", relief="raised", width=5)
label2 = tkinter.Label(root, text="Two", relief="raised", width=5)
label3 = tkinter.Label(root, text="Three", relief="raised", width=5)
label4 = tkinter.Label(root, text="Four", relief="raised", width=5)
label5 = tkinter.Label(root, text="Five", relief="raised", width=5)
# label6 = tkinter.Label(root, text="Six", relief="raised", width=5)
label7 = tkinter.Label(root, text="Seven", relief="raised", width=5)
label8 = tkinter.Label(root, text="Eight", relief="raised", width=5)
label1.grid(row=0, column=0)
label2.grid(row=0, column=1, rowspan=2)
label3.grid(row=0, column=2)
label4.grid(row=0, column=3)
label5.grid(row=1, column=0)
# label6.grid(row=1, column=1)
label7.grid(row=1, column=2)
label8.grid(row=1, column=3)
root.mainloop()

運行結果：

例子：

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One", relief="raised", width=5)
label2 = tkinter.Label(root, text="Two", relief="raised", width=5)
# label3 = tkinter.Label(root, text="Three", relief="raised", width=5)
label4 = tkinter.Label(root, text="Four", relief="raised", width=5)
label5 = tkinter.Label(root, text="Five", relief="raised", width=5)
# label6 = tkinter.Label(root, text="Six", relief="raised", width=5)
# label7 = tkinter.Label(root, text="Seven", relief="raised", width=5)
label8 = tkinter.Label(root, text="Eight", relief="raised", width=5)
label1.grid(row=0, column=0)
label2.grid(row=0, column=1, rowspan=2)
# label3.grid(row=0, column=2)
label4.grid(row=0, column=3)
label5.grid(row=1, column=0)
# label6.grid(row=1, column=1)
# label7.grid(row=1, column=2)
label8.grid(row=1, column=3)
root.mainloop()

運行結果：

sticky參數

這個參數的功能類似anchor，但是只可以設定N/S/W/E，即上/下/左/右對齊
原則上相同column的Widget 控件，如果寬度不同的話，grid方法會保留最寬的控件當做基準，這時比較短的件會居中對齊。

例子：相同column 中的Widget 控件寬度不同，控件內容會居中對齊

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One")
label2 = tkinter.Label(root, text="TwoTwoTwo", width=10)
label1.grid(row=0, column=0)
label2.grid(row=1, column=0)
root.mainloop()

運行結果：

可以看到One是根據TwoTwoTwo居中對齊的

例子：使One標籤靠左對齊

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One")
label2 = tkinter.Label(root, text="TwoTwoTwo", width=10)
label1.grid(row=0, column=0, sticky=tkinter.W)
label2.grid(row=1, column=0)
root.mainloop()

運行結果：

sticky的參數可以組合使用

參數	含義
sticky=N+S	可以拉長高度，讓控件在頂端和底端對齊
sticky=W+E	可以拉長寬度，讓控件在左邊和右邊對齊
sticky=N+S+E	可以拉長高度，讓控件在頂端和底端對齊，同時切齊右邊
sticky=N+S+W	可以拉長高度，讓控件在頂端和底端對齊，同時切齊左邊
sticky=N+S+W+E	可以拉長高度，讓控件在頂端和底端對齊，同時切齊左右邊

例子：使用relief="raised"增加外觀，同時讓控件在左邊和右邊對齊

import tkinter

# 創建主窗口
root = tkinter.Tk()
label1 = tkinter.Label(root, text="One", relief="raised")
label2 = tkinter.Label(root, text="TwoTwoTwo", relief="raised")
label1.grid(row=0, column=0, sticky=tkinter.W + tkinter.E)
label2.grid(row=1, column=0)
root.mainloop()

運行結果：

grid 方法的應用

例子：建立色彩標籤

import tkinter

colors = ["red", "yellow", "green", "blue", "purple"]

rows = 0
# 創建主窗口
root = tkinter.Tk()
for color in colors:
    tkinter.Label(root, text=color, relief="raised", width=15).grid(row=rows, column=0)
    tkinter.Label(root, bg=color, relief="raised", width=15).grid(row=rows, column=1)
    rows += 1

root.mainloop()

運行結果：

rowconfigure() 和 columnconfigure()

在設計控件的佈局時，有時候會碰上窗口縮放大小，此時可以使用這兩個方法設定第幾行row或者是column的縮放比例

"""row 0的控件當窗口改變大小時，縮放比例是1"""
rowconfigure(0, weight=1)
"""column 0的控件當窗口改變大小時，縮放比例是1"""
columnconfigure(0, weight=1)

例子：

import tkinter

# 創建主窗口
root = tkinter.Tk()
root.rowconfigure(1, weight=1)
root.columnconfigure(0, weight=1)
label1 = tkinter.Label(root, text="Label 1", bg="red")
label1.grid(row=0, column=0)
label2 = tkinter.Label(root, text="Label 2", bg="blue")
label2.grid(row=0, column=1)
label3 = tkinter.Label(root, text="Label 3", bg="green")
label3.grid(row=1, column=0, columnspan=2)
root.mainloop()

運行結果：

例子：增加sticky，讓其可以切齊左邊對齊，也讓下方的標籤可以對齊上、下、左、右邊

import tkinter

# 創建主窗口
root = tkinter.Tk()
root.rowconfigure(1, weight=1)
root.columnconfigure(0, weight=1)

label1 = tkinter.Label(root, text="Label 1", bg="red")
label1.grid(row=0, column=0, padx=5, pady=5, sticky=tkinter.W)

label2 = tkinter.Label(root, text="Label 2", bg="blue")
label2.grid(row=0, column=1, padx=5, pady=5)

label3 = tkinter.Label(root, text="Label 3", bg="green")
label3.grid(row=1, column=0, columnspan=2, padx=5, pady=5, sticky=tkinter.N+tkinter.S+tkinter.W+tkinter.E)

root.mainloop()

運行結果：

例子：

label1.grid(row=0, column=0, padx=5, pady=5, sticky=tkinter.W+tkinter.E)

運行結果：

謝謝觀看，筆者會持續更新，如有錯誤或者建議，請私信我