天天看點

Python的GUI學習筆記——Tkinter筆記 【二】認識控件與幾何管理Tkinter 控件幾何管理

這篇就簡略地介紹Tkinter庫中有哪些控件,以後會為每一個控件都詳細地寫一篇筆記記錄。

這篇主要講解用于幾何管理的三個方法的使用。

文章目錄

  • Tkinter 控件
  • 幾何管理
    • pack
      • 解答疑惑:side和anchor參數使用疑惑,expand效果疑惑
      • pack類提供的方法
    • grid
        • 舉個例子
      • grid類提供的方法
    • place
        • place類提供的方法

Tkinter 控件

目前有15種Tkinter的控件。下表簡單簡單介紹各個控件:

控件 描述
Button 按扭控件:添加按鈕
Canvas 畫布控件:顯示圖形元素,用于繪圖
Checkbutton 多選框控件:提供多個選項的選擇框,嗯用來制作多選題不可少
Entry 輸入控件:接受使用者的輸入
Frame 架構控件:顯示一個矩形區域,用于布局美觀
Label 标簽控件:可以顯示文本和位圖
LabelFrame 簡單的容器控件: 常用于複雜的視窗布局
Listbox 清單框控件:一個選項清單,使用者可以從中選擇
Menubutton 菜單按鈕控件:顯示菜單項
Menu 菜單控件:顯示菜單欄,下拉菜單和彈出菜單
Message 消息控件:展示一些文字短消息,與Label類似,但更好
Radiobutton 單選按鈕控件:顯示一個單選的按鈕
Scale 範圍控件:顯示一個數值刻度,為輸出限定範圍的數字區間
Scrollbar 滾動條控件:為友善檢視超出可視化區域的内容
Text 文本控件:顯示和處理多行文本
tkMessageBox 顯示您應用程式的消息框
Toplevel 容器控件:顯示和處理多行文本
Spinbox 輸入控件:與Entry類似,但可以指定輸入範圍值
PanedWindow 視窗布局管理的插件:可以包含一個或者多個子控件

幾何管理

Tkinter公開的幾何管理類:包、網格、位置

幾何方法 描述
pack() 包裝
grid() 網格
place() 位置
  • pack是按添加順序排列控件
  • grid是按行/列形式排列控件
  • place則可以指定控件大小和位置

pack

采用塊的方式組織配件。

在快速生成界面設計中廣泛采用,若幹元件簡單的布局,采用pack的代碼量最少。

如果不指定pack的option參數,pack會從上到下的放置widget(控件)。

pack方法提供了以下的option選項,也就是可接受的參數:

參數名 描述 參數值
after 讓你的控件在指定的控件之後pack 控件對象
anchor 确定放置的方向, 左=‘w’, 右=‘e’,頂=‘n’,底=‘s’,中=‘center’,可以組合 但必須小寫 ‘n’, ‘s’, ‘e’, ‘w’, ‘nw’, ‘sw’, ‘se’, ‘ne’, ‘center’(預設為’center’)
before 讓你的控件在指定的控件之前pack 控件對象
expand 當為True值時,随着父類控件大小增長,控件所在位置也會發生改變 True, ‘y’, ‘yes’, False, ‘n’, ‘no’,(不區分大小寫)
fill 控件填充指定的方向 ‘x’, ‘y’, ‘both’
in_ 標明的控件包含本控件,即變成標明控件的子控件, 放在標明控件中 控件對象
ipadx, ipady 内部填充。控件内部在x(y)方向上填充的空間大小,預設機關為像素,可選機關為c(厘米)、m(毫米)、i(英寸)、p(列印機的點,即1/27英寸),用法為在值後加以上一個字尾既可 非負浮點數
padx, pady 外部填充。控件外部在x(y)方向上填充的空間大小,預設機關為像素,可選機關為c(厘米)、m(毫米)、i(英寸)、p(列印機的點,即1/27英寸),用法為在值後加以上一個字尾既可 非負浮點數
side 添加在父類控件的哪邊 ‘top’, ‘bottom’, ‘left’, ‘right’

解答疑惑:side和anchor參數使用疑惑,expand效果疑惑

初學的時候,expand問題,side和anchor參數布局的問題疑惑了我很久,經過很長事件的摸索我才逐漸弄明白大概是怎麼一回事,現在把它寫下來。都是自己的感悟,也許思想上會有誤區。

首先講解一下參數anchor的布局:

anchor參數隻能讓控件一個一個地由上到下放置好,無法放置在其他控件旁邊。

Python的GUI學習筆記——Tkinter筆記 【二】認識控件與幾何管理Tkinter 控件幾何管理

上圖就是三個區域,控件一個個放進去,一個區域放一個控件。

然後anchor參數讓控件在獨自的區域類擺放位置或靠左或靠右等,區域的寬也許

大于控件的寬

,但一般

高等于控件的高

然後講解一下參數side的布局:

side可以上下左右布局,但是呢,也如anchor一樣一個區域隻允許一個控件。具體介紹看圖。

Python的GUI學習筆記——Tkinter筆記 【二】認識控件與幾何管理Tkinter 控件幾何管理

分為五個區域塊,四邊是side定義可安放的位置, 中間不放控件的話會自動合并在一起。side預設值為top。

Python的GUI學習筆記——Tkinter筆記 【二】認識控件與幾何管理Tkinter 控件幾何管理
  • 首先放置一個side='left’的控件,它會占據上圖LEFT1的區域,于是該區域再也不能放其他控件了。
  • 第二個若是還放置side='left’控件的話,它會占據LEFT2,若是放side='right’則放在RIGHT1。
  • 占區域有個放置的優先順序。空白區域不放其他的控件,就會省略掉。

如果放了四個區域,接着放side='top‘, side=‘bottom’, side=‘left’, side=‘right’, 那麼就會如下:

Python的GUI學習筆記——Tkinter筆記 【二】認識控件與幾何管理Tkinter 控件幾何管理

那麼會發現裡面的左右區域比外面的四個小了很多。

說了這麼多,就是想表明,對于side而言,占區域有個先後順序。

import tkinter as tk


root = tk.Tk()

b1 = tk.Button(root, text='hello side b1')
b2 = tk.Button(root, text='hello side b2')
b3 = tk.Button(root, text='hello side b3')
b4 = tk.Button(root, text='hello side b4')

# 待插入代碼

root.mainloop()

           

在帶插入代碼下插入以下代碼:

b1.pack(side='top')
b2.pack(side='bottom')
b3.pack(side='left')
b4.pack(side='right')
           

再換代碼段插入試試:

b1.pack(side='left')
b2.pack(side='right')
b3.pack(side='top')
b4.pack(side='bottom')
           

結果就是不一樣,嗯,占區域有個先後順序。

side與anchor參數總結:

那麼現在就大緻明白的side與anchor布局疑惑。

side控制擺放在四個方向的大緻位置,然後anchor可以控制控件放置在區域内的某個位置。

一個區域隻放一個控件。

對于expand參數。

當值為True時,即expand取True或’y’等,拉大視窗的話,

控件所在的區域就會被拉大

,控件是不會變化大小的,故而會發現控件間的距離似乎變大了。

而expand為False時(expand預設為False),

區域高度不會改變,但寬度會不斷延伸

,上面提到過空白區域會自動省略,但是拉大視窗會多出空白區域。

測試代碼如下:

import tkinter as tk


root = tk.Tk()

b1 = tk.Button(root, text='hello anchor b1')
b2 = tk.Button(root, text='hello anchor b2')
b3 = tk.Button(root, text='hello anchor b3')
b1.pack(expand='no', anchor='w')
b2.pack(expand='no', anchor = 'center')
b3.pack(expand='no', anchor = 'w')


root.mainloop()
           

會發現拉大視窗後,隻有中間的按鈕2在移動。

那是因為拉大視窗,按鈕2所在的區域寬度在延伸,由于anchor為center故而不斷放置在區域中央。

若是expand全設定為True,那麼三個按鈕位置都會随着視窗變大而變大,那是因為每個區域都開始變大。嗯,若果你把按鈕1的anchor設定為’nw’的話會有不一樣的體驗與更深的了解。

expand參數總結:

如果為True,那麼控件所在的區域會随父控件大小改變而改變。

否則為False,那麼控件所在的區域的寬度會延伸但高度不會發生改變。

還是強調,一個區域隻能放置一個控件。

pack類提供的方法

方法名 描述
forget() Unpack控件件,将控件隐藏并且忽略原有設定,對象依舊存在。
info() 傳回一個清單, 包含pack提供的所有參數對應的值
propagate(bool) 傳參為True,表示父控件的幾何大小由子控件決定, 反之固定大小。
slaves() 傳回一個清單, 包含所有該控件的所有子控件對象

使用方法就是,定義一個控件對象, pack後

對象名.方法名()

grid

采用類似表格的結構組織配件,使用起來非常靈活。

Grid(網格)布局管理器會将控件放置到一個二維的表格裡。表格中的每個單元(cell)都可以放置一個控件。

grid方法提供了以下的option選項,也就是可接受的參數:

參數名 描述 參數值
column 控件放置在第幾列單元格中 自然數(起始預設值為0)
columnspan 從控件所放置單元格算起,在列方向上的跨度。即列方向上的多個格子合并在一起,讓後放一個控件 自然數(預設值為1)
in_ 標明的控件包含本控件,即變成標明控件的子控件, 放在標明控件中 控件對象
ipadx, ipady 内部填充。控件内部在x(y)方向上填充的空間大小,預設機關為像素,可選機關為c(厘米)、m(毫米)、i(英寸)、p(列印機的點,即1/27英寸),用法為在值後加以上一個字尾既可 非負浮點數
padx, pady 外部填充。控件外部在x(y)方向上填充的空間大小,預設機關為像素,可選機關為c(厘米)、m(毫米)、i(英寸)、p(列印機的點,即1/27英寸),用法為在值後加以上一個字尾既可 非負浮點數
row 控件放置在第幾行單元格中 自然數(起始預設值為0)
rowspan 從控件所放置單元格算起,在行方向上的跨度。即行方向上的多個格子合并在一起,讓後放一個控件 自然數(預設值為1)
sticky 如果單元格很大,控件會緊靠單元格的某一邊界(與pack方法的anchor作用類似) ‘n’, ‘s’, ‘e’, ‘w’, ‘nw’, ‘sw’, ‘se’, ‘ne’, ‘center’(預設為’center’)

舉個例子

以下代碼展示了columnspan和sticky的效果。

import tkinter as tk


root = tk.Tk()

b1 = tk.Button(root, text='hello b1')
b2 = tk.Button(root, text='hello b2')
b3 = tk.Button(root, text='hello b3')
b4 = tk.Button(root, text='hello b4')

b1.grid(row=0, column=1)
b2.grid(row=1, column=1)
b3.grid(row=2, column=1)
b4.grid(row=1, column=2, rowspan=2, columnspan=2)
# 先測試代碼,然後替換注釋掉的b4, 再檢查結果。
# b4.grid(row=1, column=2, rowspan=2, columnspan=2, sticky='nw')
root.mainloop()

           

grid類提供的方法

方法名 描述
bbox(column, row, col2, row2) Return a tuple of integer coordinates for the bounding box of this widget controlled by the geometry manager grid. If COLUMN, ROW is given the bounding box applies from the cell with row and column 0 to the specified cell. If COL2 and ROW2 are given the bounding box starts at that cell.The returned integers specify the offset of the upper left corner in the master widget and the width and height.
forget() 将控件隐藏并且忽略原有設定,對象依舊存在。
info() 傳回一個清單, 包含grid提供的所有參數對應的值
location(x, y) Return a tuple of column and row which identify the cell at which the pixel at position X and Y inside the master widget is located.
propagate(bool) 傳參為True,表示父控件的幾何大小由子控件決定, 反之則固定大小。
size() Return a tuple of the number of column and rows in the grid.
slaves(row, column) 傳回一個清單, 包含所有該控件的所有子控件對象

方法bbox,location和size不太清楚,有講解似乎很明了的資料但是發現自己運作的代碼卻總不是不對勁。就暫且放一放,以後更新。

place

Place 布局管理可以顯式的指定控件的絕對位置或相對于其他控件的位置。

place方法提供了以下的option選項,也就是可接受的參數:

參數名 描述 參數值
anchor 确定放置的方向 ‘n’, ‘s’, ‘e’, ‘w’, ‘nw’, ‘sw’, ‘se’, ‘ne’, ‘center’(預設為’center’)
bordermode 指定邊框模式 ‘inside’, ‘outside’(預設值為’inside’)
height 控件的高度 非負浮點數
in_ 標明的控件包含本控件,即變成標明控件的子控件, 放在標明控件中 控件對象
relheight, relwidth 控件相對于父控件的高寬 0.0 - 1.0
relx, rely 控件相對于父控件的位置 0.0-1.0
width 控件的寬度 非負浮點數
x, y 控件的位置(像素),如果同時指定了relx/rely選項,優先實作relx/rely 非負浮點數

place類提供的方法

方法名 描述
forget() 将控件隐藏并且忽略原有設定,對象依舊存在。
info() 傳回一個清單, 包含place提供的所有參數對應的值
slaves() 傳回一個清單, 包含所有該控件的所有子控件對象

上一篇:視窗設定

下一篇:Label控件

繼續閱讀