Tkinter 套件


Tkinter 是 Python 的標準庫(Standard Library)中的一個模組(module)。作為呼叫 Tcl/Tk GUI 工具包的介面,使得開發者能夠建立跨平台的基本圖形用戶界面(GUI)。
Tkinter 的視窗
常用方法有:
- title(string):設定視窗標題。
- geometry(string):設定視窗的寬度和高度。
- resizable(width, height):設定視窗是否可以調整大小。
- mainloop():保持視窗執行,等待處理事件。
- after(delay, callback, *args):可在指定的毫秒數後執行傳入的函式(callback function)。
- withdraw():隱藏視窗。
- deiconify():顯示已隱藏的視窗。
- quit():只停止事件循環。
- destroy():徹底關閉和銷毀整個視窗及其所有子元件。
- iconbitmap():設定視窗圖示。
- config() / configure():設定視窗屬性。常用的屬性如下:
- bg / background:背景色。
- fg / foreground:前景色。
- width 和 height:設定視窗的寬度和高度。
- cursor:設定滑鼠游標的形狀。
- takefocus:設定是否可以使用 Tab 鍵切換到該視窗。
- attributes(option, value):設定或查詢視窗的屬性。常用的屬性如下:
- -alpha:設置視窗透明度 (0.0 - 1.0)。
- -topmost:設置視窗置頂 (True / False)。
- -width / -height:設置視窗寬度與高度(px)
Tkinter 的佈局
Tkinter 提供了 3 種佈局方法,用於安排 GUI 元素的位置和大小,並可同時使用這些佈局。
- pack 方法適用於簡單的垂直或水平佈局,不需要精確控制元素的位置和尺寸。
- grid 方法適用於表格佈局,需要精確控制元素在列和欄中的位置。
- place 方法適用於想精確控制元素位置和大小,需要相對自由的佈局。
1. Pack 佈局
side |
padx、pady |
 |
 |
- pack() 方法是最基礎的佈局,可將畫面元件依序由上至下置中排列,放置到容器中。
- 如果要將部分元件安排由左至右排列,必須先加上 frame 容器,再將元件設定靠左,依序放入 frame 容器中。
- 可用的參數
- side:元件放置的方向,可設定上下左右 4 個值
side = "top", "bottom", "left", "right"
- anchor:元件在其可用空間中的錨點位置,可設定北,南,西,東,西北,東北,西南,東南 8 個值
anchor = "n", "s", "w", "e", "nw", "ne", "sw", "se"
- fill:元件在可用空間的擴充方向,可設定不擴充, 水平擴充, 垂直擴充, 水平和垂直皆擴充,預設為不擴充
fill = tk.NONE / tk.X / tk.Y / tk.BOTH
fill = "none" / "x" / "y", "both"
- expand:可否擴張元件的可用空間,預設為 False
expand = True / False
- padx、pady:指定元件周圍的水平和垂直內邊距
padx=5, pady=10
- ipadx、ipady:指定元件內容的水平和垂直內邊距
ipadx=5, ipady=10
基本範例:
更多的範例:
2. Grid 佈局

row 與 column 的翻譯
台灣:橫列(row)豎欄(column)
大陸:橫行(row)豎列(column)
- grid() 方法是網格式佈局,可將畫面元件指定 row 及 column 放置到容器中。
- 可用的參數
- row、column:指定元件在 grid 中的【列】和【欄】的位置。例如:
row=0, column=2
表示元素放置在第 0 列、第 2 欄。
- rowspan、columnspan:這兩個參數分別指定元件在 grid 中跨越的列數和欄數。例如:
rowspan=3, columnspan=2
表示元素跨越了 3 列和 2 欄。
- sticky:指定元件的對齊方式,可設定方向字母,包含了
sticky = "n", "s", "e", "w", "nw", "se", ew", "ns", nsew"
- padx、pady:指定【元件周圍】的水平和垂直內邊距
padx=5, pady=10
- ipadx、ipady:指定【元件內容】的水平和垂直內邊距
ipadx=5, ipady=10
因為 grid 佈局是自動排列,以欄 (column)為例,若某欄沒有元件,則該欄的寬度將自動收縮為零,即使你指定了元件在後面的欄也一樣。

:star: 若 frame 內未放置任何元件,又沒有設定其 width、height 或 sticky,則其大小將視為 0,就算設定了背景色,會因其不佔空間而看不到。
列與欄的權重用途
如上一節所說,如果某個欄沒有元件,則看不見此欄,因為其寬度為 0,若希望某欄即使沒有元件,仍保留該欄位寬度,則可使用 columnconfigure 來設定【欄】的權重。【列】也是相同的思路,用的是 rowconfigure 方法。
請以下列2種方法,達成如下圖般左右分開的佈局。
- rowconfigure / grid_rowconfigure 方法: 用於設定特定列的屬性,如權重。
- columnconfigure / grid_columnconfigure 方法: 用於設定特定欄的屬性,如權重。

思考題:
假設增加至3個 frame 色塊,想將之排列為如下圖的倒三角形,該如何撰寫?

以下3種做法皆可達成,但如何解釋呢?
練習題:請以 grid 佈局做出如下圖的視窗
- 視窗大小:400x300
- 5 個 frame 顏色:red, yellow, blue, lightgreen lightblue
- 3 個 label 文字:left, center, right

3. Place 佈局

- place() 佈局方法若使用 x、y 參數時是絕對坐標佈局,使用 relx、rely 參數時是相對坐標佈局。
- 可用的參數
- x、y:指定元件相對於其父容器的左上角的絕對坐標。單位是像素(pixels)。
x=10, y=10
- relx、rely:指定元件相對於其父容器的相對坐標。值在 0.0 到 1.0 之間。
relx=0.2, rely=0.2
- anchor:元件在其可用空間中的錨點位置,可設定北,南,西,東,西北,東北,西南,東南 8 個值
anchor = "n", "s", "w", "e", "nw", "ne", "sw", "se"
- width、height:元件的絕對寬度和高度
width=100, height=30
- relwidth、relheight:元件相對於其父容器的寬度和高度。值在 0.0 到 1.0 之間。
relwidth=0.5, relheight=0.5
tkinter 的常用事件

Tkinter 提供了兩種方法來綁定事件函式:【command 參數】和 【bind 方法】,command 參數主要用於簡單的固定事件,而 bind 方法則適合處理更複雜、多樣的事件。
以下我們來看看 Tkinter 提供哪些事件?
- 滑鼠事件
- 鍵盤事件
- 焦點事件
- 視窗事件
- 其他事件
tkinter 事件函式的 event 參數
當事件處理函數被呼叫時,它可以接收一個事件物件(event)作為參數。而 event 物件封裝了事件相關信息。包含了事件類型、發生的元件、滑鼠位置…等等。
- event.type:返回事件的類型,例如
<ButtonPress>
。
- event.widget:返回觸發事件的元件。
- event.x 和 event.y:返回事件在元件中的發生位置的 x 和 y 坐標。
- event.keysym:keysym 返回按鍵的名稱(例如,"a","Enter")。
- event.char:char 返回與按鍵相對應的字元。
- event.state:返回與事件相關的狀態信息,例如 Shift、Control 和 Alt 鍵是否被按下。
- event.num:返回與滑鼠按鈕事件相關的滑鼠按鈕號碼。
原始碼範例如下:
tkinter 定義的常數
Tkinter 模組中有一些常見的常數(Constants),通常用於表示特定的屬性、事件或狀態。這些常數主要是提供易於記憶和使用的標示符,方便在程式過程中參照特定的屬性或事件。以下是一些常見的 Tkinter 常數:
- 對齊常數(Alignment Constants):
- tk.LEFT, tk.RIGHT, tk.TOP, tk.BOTTOM:用於指定部件的對齊方式,例如在 pack() 佈局管理器中。
label = tk.Label(root, text="Hello, Tkinter", anchor=tk.CENTER)
- 方向常數(Orientation Constants):
- tk.HORIZONTAL, tk.VERTICAL:用於指定水平或垂直方向,通常在建立滾動條或其他控制元件時使用。
scrollbar = tk.Scrollbar(root, orient=tk.HORIZONTAL)
- 對話框回應常數(Dialog Response Constants):
- tk.YES, tk.NO, tk.CANCEL, tk.OK, tk.YES_NO, tk.YES_NO_CANCEL:用於表示對話框回應的選項。
tk.messagebox.showinfo("Information", "This is an information message.")
tk.messagebox.showwarning("Warning", "This is a warning message.")
- 視窗顯示模式常數(Window Display Mode Constants):
- tk.NORMAL:用於表示視窗處於正常狀態。
- tk.ICONIC:用於表示視窗處於最小化或圖示化狀態。
- tk.WITHDRAWN:用於表示視窗被隱藏(withdrawn)。
form.iconify() # 最小化主視窗
form.withdraw() # 隱藏主視窗
- 狀態常數(State Constants):
- tk.NORMAL:用於表示元件處於正常狀態。
- tk.DISABLED:用於表示元件處於禁用狀態。
button = tk.Button(root, text="按我", state=tk.DISABLED)
- 插入位置索引常數(Insertion Position Index Constants):用於 Entry 或 Text 元件中指定特定的位置。
- tk.INSERT:表示當前插入符號(輸入游標)的位置。
- tk.END:表示文字的結尾位置。
entry.insert(tk.END, "Hello, Tkinter!")
在 Tkinter 中,widgets 是可實例化的類別,每個類別代表一種 GUI 元素,例如 Label、Button、Entry 等。開發者可以使用這些 widgets 來構建 GUI,並透過配置它們的屬性和方法來定義應用程式的外觀和行為。
所有的 widgets 都是 Widget 類別的子類別,這個基礎類別提供了一些通用的屬性和方法,供所有的 widgets 繼承和使用。

以下介紹的元件,除了 Menu 與 Canva 之外,皆有 ttk 的主題更新元件可用,建議改用之。
Label(標籤)
顯示文字或圖片
Label 元件還有一些其他常用的方法(pack 與 bind 方法就不提了),例如:
- config():可變更 Label 的各種屬性,例如文字顏色、背景顏色、字體等。
- cget():取得 Label 特定屬性目前的值
- destroy():自容器中移除 Label 元件
label.destroy()
PhotoImage 的圖片檔案格式處理
若進行圖片處理遇到 couldn't recognize data in image file...
的錯誤,代表此圖片的檔案格式不被認可,此時可使用 PIL(Python Imaging Library) 模組進行格式轉換,範例如下:
tkinter 元件的賦值
在 tkinter 中,將元件的賦值方式大致分為兩種:
- 固定給值: 使用直接的屬性(例如 text 屬性)將元件的值固定指定為一個固定的值。這種方式在建立元件時就確定了元件的初始值,之後通常不會動態變化。
- 動態給值: 使用特定的 tkinter 變數(例如:StringVar, IntVar, BooleanVar, DoubleVar)作為元件 【textvariable 屬性】,使元件的值可以動態的與這個變數關聯。當這個變數的值改變時,元件的值也對應改變,實現了動態的效果。
Labelframe(標籤框)

Labelframe 是 tkinter 中的一種容器元件,用於將元件分組並提供標題。
常用屬性:
- text 屬性: 設置或獲取標籤框的標題文字。
- labelanchor 屬性: 設置或獲取標籤框標題的錨點位置。
- padx, pady 屬性: 設置標籤框內容的水平和垂直填充。
- borderwidth, relief 屬性: 設置標籤框的邊框寬度和樣式。
- width, height 屬性: 設置標籤框的寬度和高度。
常用方法:
- config(**options) 方法: 用於動態設置標籤框的屬性。
- cget(option) 方法: 用於獲取標籤框的指定屬性值。
- grid, pack, place 方法: 用於標籤框的佈局管理,決定標籤框在父容器中的位置。
- bind 方法: 用於綁定事件處理程序,例如當標籤框被單擊時執行特定的函數。
原始碼範例
import tkinter as tk
def on_button_click():
global title_text
labelframe.config(text=title_text + " - 修改後")
labelframe.config(width=300, height=200)
form.columnconfigure(0, weight=1)
form = tk.Tk()
form.title("Labelframe 範例")
form.geometry("400x300")
labelframe = tk.LabelFrame(form, text="個人資料", padx=10, pady=10, borderwidth=2, relief="groove")
labelframe.grid(row=0, column=0, padx=20, pady=20, sticky="nsew")
label_name = tk.Label(labelframe, text="姓名")
label_name.grid(row=0, column=0, padx=5, pady=5, sticky="e")
entry_name = tk.Entry(labelframe)
entry_name.grid(row=0, column=1, padx=5, pady=5, sticky="w")
label_type = tk.Label(labelframe, text="型別")
label_type.grid(row=1, column=0, padx=5, pady=5, sticky="e")
entry_type = tk.Entry(labelframe)
entry_type.grid(row=1, column=1, padx=5, pady=5, sticky="w")
label_phone = tk.Label(labelframe, text="手機")
label_phone.grid(row=2, column=0, padx=5, pady=5, sticky="e")
entry_phone = tk.Entry(labelframe)
entry_phone.grid(row=2, column=1, padx=5, pady=5, sticky="w")
button = tk.Button(form, text="點擊我", command=on_button_click)
button.grid(row=1, column=0, pady=10)
labelframe.config(labelanchor="nw")
title_text = labelframe.cget("text")
form.mainloop()
- 按鈕的文字可使用 text 指定,也可以後續透過 config() 方法設定。
- 按鈕被點擊時執行的函數可使用 command 指定,也可以後續透過 config() 方法設定。

Button 元件還有一些其他常用的方法(pack 與 bind 方法就不提了),例如:
- config():可變更 Button 的各種屬性,例如字體(font)、文字(text)、背景色(bg)、前景色(fg)、按鈕的寬度和高度(width / height)、按鈕的狀態(state)、圖片(image)…等。
- invoke():模擬按下按鈕的操作。
- destroy():自容器中移除 Button 元件
button.destroy()
- instate():檢查按鈕是否處於 DISABLED/ NORMAL狀態
Entry(輸入框)
輸入框可以使用 textvariable 來綁定變數,以便在程式中動態獲取或設置輸入的文字。

Entry 元件還有一些其他常用的方法(pack 與 bind 方法就不提了),例如:
- config():可變更 Entry 的各種屬性。
- show: 密碼輸入,輸入的字元會被轉換為指定字元
- state: 設置為 "normal"(正常)或 "disabled"(禁用)
- width: 以字元為單位的寬度
- font: 字體
- bg/background、fg/foreground: 背景色和前景色
- get():獲取 Entry 元件中的文字。
input_text = entry.get()
- delete(startindex, endindex):刪除 Entry 元件中從 startindex 到 endindex 之間的文字。
entry.delete(0, tk.END)
- focus():設為焦點
- icursor(index):將輸入游標(插入符號)移動到指定的 index 位置。
- index(index):返回文字的指定索引位置。
- select_range(start, end):選取 Entry 元件中從 start 到 end 之間的文字。
- select_clear():取消 Entry 的選取。
當有多個選擇但只能選一個的時後,就可以使用 Radiobutton 元件,同一組選擇的 variable 屬性必須設定同一個 tkinter 變數。
主要的屬性如下:
- text(文字): 按鈕上顯示的文字標籤。
- variable(變數): 用來綁定一個 tkinter 變數,通常是 tkinter.StringVar(),這樣可以確保選項屬於同一個群組。
- value(值): 指定當選擇此按鈕時,變數的值應該是什麼。這個值會被存儲在與 variable 綁定的 tkinter 變數中。
- bg / background: 設置背景色。
- fg / foreground: 設置前景色,即文字顏色。
- cursor:當滑鼠懸停在 Radiobutton 上時的游標樣式。
本範例使用 grid 佈局
Radiobutton 元件還有一些其他常用的方法(pack 與 bind 方法就不提了),例如:
- invoke(): 方法用於模擬單選按鈕被單擊。
- select():選中 Radiobutton。這會將與該單選按鈕關聯的變數設置為其值。
- deselect(): 取消選中 Radiobutton。這將取消與該單選按鈕關聯的變數。
- get(): 獲取與該 Radiobutton 關聯的變數的值。這是用於檢索目前選擇的值的方法。
本範例使用 grid 佈局,進階參考
import tkinter as tk
def get_selection():
selected_value.set(radiobutton_var.get())
result_label.config(text=f"選擇是: {selected_value.get()}")
def clear_selection():
radiobutton_var.set("")
selected_value.set("")
result_label.config(text="")
def simulate_click():
radiobutton2.invoke()
get_selection()
form = tk.Tk()
form.title("選項按鈕範例")
form.geometry("250x180")
selected_value = tk.StringVar(value="")
radiobutton_var = tk.StringVar()
radiobutton1 = tk.Radiobutton(text="選項 X", variable=radiobutton_var, value="選項 X", bg="#FFD700")
radiobutton2 = tk.Radiobutton(text="選項 Y", variable=radiobutton_var, value="選項 Y", bg="#FFD700")
radiobutton3 = tk.Radiobutton(text="選項 Z", variable=radiobutton_var, value="選項 Z", bg="#FFD700")
radiobutton1.grid(row=0, column=0, padx=30, pady=5, sticky=tk.W)
radiobutton2.grid(row=1, column=0, padx=30, pady=5, sticky=tk.W)
radiobutton3.grid(row=2, column=0, padx=30, pady=5, sticky=tk.W)
get_selection_button = tk.Button(form, text="抓取選擇", command=get_selection, bg="#FFA07A")
get_selection_button.grid(row=1, column=1, padx=30, pady=5, sticky=tk.W)
clear_selection_button = tk.Button(form, text="清除選擇", command=clear_selection, bg="#FFA07A")
clear_selection_button.grid(row=2, column=1, padx=30, pady=5, sticky=tk.W)
simulate_click_button = tk.Button(form, text="模擬單擊", command=simulate_click, bg="#FFA07A")
simulate_click_button.grid(row=3, column=1, padx=30, pady=5, sticky=tk.W)
result_label = tk.Label(form, text="", pady=5)
result_label.grid(row=3, column=0, padx=30, pady=5, sticky=tk.W)
form.mainloop()
屬性的 text 與 value不同
通常 Radiobutton 屬性的 text 與 value 會是相同的值,程式碼會比較好處理,但若遇到 text 與 value 必須不同,而且需要分別抓出選項的這二個值,則請看下來範例:
本範例使用 grid 佈局,進階參考
每個元件有【選擇】與【不選擇】二種狀態,如果想進行複選,每個 Checkbutton 需要擁有獨立的 tk.IntVar() 變數。如此它們的狀態就可以獨立地被選中或取消選中。
如果多個 Checkbutton 的 variable 設為相同的 tk.IntVar() 變數,它們將共享這個變數,會產生類似於 Radiobutton 的結果,只有一個 Checkbutton 能被選中。
主要的屬性如下:
- text(文字):顯示在 Checkbutton 旁邊的文字標籤。
- variable(變數):用於存儲 Checkbutton 的選中狀態的 tkinter 變數,通常是 tkinter.IntVar(),這樣可以確保屬於同一個群組。
- onvalue, offvalue:設定選中和未選中時,variable 的值。未設定時,variable 的預設值是 1 和 0。
- command:在 Checkbutton 被點擊時執行的函數。
- bg / background:設置背景色。
- fg / foreground:設置前景色,即文字顏色。
- cursor:當滑鼠懸停在 Checkbutton 上時的游標樣式。
原始碼範例
Checkbutton 元件還有一些其他常用的方法(pack 與 bind 方法就不提了),例如:
- select(): 選中(勾選)Checkbutton。
- deselect(): 取消選中(取消勾選)Checkbutton。
- toggle(): 切換 Checkbutton 的選中狀態。
- invoke(): 模擬使用者點擊 Checkbutton,觸發其相關事件。
本範例使用 grid 佈局
具有 textvariable 屬性的元件包括
- Label: 用來顯示文字的標籤。
- Entry: 文字輸入框。
- Message: 用來顯示多行文字的元件。
具有 variable 屬性的元件包括
- Radiobutton: 單選按鈕。
- Checkbutton: 多選按鈕 (勾選框)。
Frame:容器,可將各種元件放在同一個容器方便管理

就像網頁的 <div>
標籤概念,Frame 可建立一個容器,可包含其他元件,例如按鈕、標籤、文字方塊,主要屬性有
- bg / background:設定 Frame 的背景顏色。
- width、height:設定 Frame 的寬度和高度。
- relief:設定 Frame 邊框的樣式,常用的有 "flat"、"raised"、"sunken" 等。
- padx、 pady:設定 Frame 內部的水平和垂直填充。
- bd / borderwidth:設定 Frame 的邊框寬度。
本範例使用 place 佈局
frame 元件的方法都是繼承父類別的共通方法,例如 config(), bind(), destroy()。
Listbox:列表框

Listbox 元件用於顯示一個有多個選項的列表供使用者選擇。常用的屬性包含:
- selectmode:設定選擇模式,可以是 tk.SINGLE(單選)或 tk.MULTIPLE(多選)。
- height、width:設定 Listbox 的高度和寬度。
- bg / background、fg / foreground:設定背景和前景顏色。
- font:設定字體。
常見的 Listbox 方法如下
- insert(index, *elements): 在指定索引位置插入一個或多個元素。
- delete(first, last=None): 刪除指定範圍內的元素。
- get(first, last=None): 獲取指定範圍內的元素。
- curselection(): 返回當前所選的元素的索引。
- size(): 返回列表中的元素數量。
- selection_set(first, last=None): 將指定範圍的元素設置為選取狀態。
- selection_clear(first, last=None): 清除指定範圍內的元素的選取狀態。
通常搭配 Text Widget 進行使用,可以設定為水平捲動或垂直捲動。
Text:文字框

Tkinter 的 Text widget 是用來顯示和編輯多列文字的元件。常用的屬性有:
- height:設定 Text widget 的高度,以列數為單位。
- width:設定 Text widget 的寬度,以字元數為單位。
- wrap:指定文字如何被包裹。可選值包括 tk.NONE(不換行)、tk.CHAR(以字元換行)和 tk.WORD(以單字換行)。
- insertbackground:設定插入點的背景顏色。
- insertwidth:設定插入點的寬度(以像素為單位)。
- font:設定文字的字型、大小等。
- bg:設定背景顏色。
- fg:設定文字顏色。
- state:設定 Text widget 的狀態,可為 "normal"(可編輯)或 "disabled"(不可編輯)。
- yscrollcommand:須搭配 Scrollbar 元件,才能垂直捲動。
- xscrollcommand:須搭配 Scrollbar 元件,才能水平捲動。
Text 元件常用的方法有:
- insert(index, text, tags=None):在指定的索引處插入文字,可以指定文字的標籤(tags)。
- delete(startindex, endindex=None):刪除指定範圍的文字。如果 endindex 為 None,則只刪除指定索引的文字。
- index(index):取得指定索引處的文字位置。
- mark_set(mark, index):將指定標記移動到 Text 元件的特定位置,常用的標記名稱有 tk.INSERT、tk.SEL、tk.CURRENT、tk.END、tk.USER。
- see(index):捲動 Text widget 以使指定索引的文字可見。
- get(startindex, endindex=None):取得指定範圍的文字。
- search(needle, startindex, stopindex, forwards=True, backwards=True, exact=False, regexp=False):在指定範圍內搜索文字,返回第一個找到的位置。
Tkinter 的 Scrollbar 與 Text 元件使用的範例原始碼:
https://gist.github.com/peterju/4f0beebfff2bccfb8e0f2a91c342fffe
Scale:滑動條

滑動條元件,可滑動一個數值範圍,方便選擇明確的數字。常用的屬性如下:
- from_:指定滑動條的最小值。
- to:指定滑動條的最大值。
- orient:指定滑動條的方向,可以是 tk.HORIZONTAL 或 tk.VERTICAL。
- length:指定滑動條的長度,單位是像素。
- showvalue:決定是否在滑動條上方顯示數值。可以設定為 0(不顯示)或 1(顯示)。
- tickinterval:設定刻度的間隔。
- resolution:滑動條的解析度,即滑動一次的步進值。
- command:滑動條值發生變化時呼叫的函數。
- variable:用於綁定一個 tkinter 變數,當滑動條值改變時,這個變數的值也會同步改變。
- digits:指定顯示數值的小數位數。
- label:設定滑動條的標籤
- troughcolor:設定滑動條的背景,這個屬性的值可以是一個顏色名稱(例如 "red")、十六進制顏色碼(例如 "#FF0000")或其他支援的顏色表示形式。
滑動條常用的方法有:
get()
:用於獲取滑動條的當前值。
set(value)
:用於設定滑動條的值。
config(**options)
:用於設定或修改滑動條的配置選項。
invoke(element)
:用於觸發或執行與滑動條相關聯的元素(例如連結的命令)。
範例程式碼:https://gist.github.com/peterju/e3fd16776bd1f2dd6d7800915dc3cb4c
Spinbox:數值調整/選單輸入框

Spinbox 也是一種輸入框,除了可直接輸入數值之外,可以用上下箭頭增減數值,或用滑鼠點選右方的上下箭頭進行數值增減。 與 Scale 元件相同都可以拿來輸入數值。
Spinbox 也可以提供列表值,可以用上下箭頭或用滑鼠點選右方的上下圖示進行選擇。功能上與 ttk 的 combobox 相似。
常用屬性:
- from_ 屬性: 設置可選值的起始範圍。
- to 屬性: 設置可選值的結束範圍。
- values 屬性: 指定一個離散的值列表,而不是範圍。
- increment 屬性: 設置增加或減少的步長。
- textvariable 屬性: 設置或獲取與 Spinbox 關聯的 StringVar(或其衍生類型)物件。
- state 屬性: 設置元件的狀態
- "normal": 允許使用者以輸入、鍵盤、滑鼠修改值。
- "readonly": 不允許輸入修改值,但鍵盤與滑鼠可以。
- "disabled": 僅顯示其值,輸入、鍵盤、滑鼠皆無法修改值且以灰暗顯示。
- wrap 屬性: 如果設置為 True,則在達到範圍的末尾時,Spinbox 的值將從開始處繼續。
常用方法:
- delete(start, end) 方法: 用於從 Spinbox 中刪除文字。
- get() 方法: 用於取得當前 Spinbox 的值。
- icursor(index) 方法: 用於設置插入符號(游標)的位置。
- index(index) 方法: 用於取得指定索引位置的字元。
- insert(index, string) 方法: 用於在指定的索引位置插入字元。
- invoke() 方法: 用於手動觸發 Spinbox 上的動作。通常用於模擬用戶單擊箭頭按鈕的操作。
範例原始碼:

在 ttk 中沒有對應的主題化版本
用於在視窗上建立選單。常用的屬性有:
- tearoff(拆分): 用於決定選單是否可以被拆分出來。如果設置為 1,則選單可以被拆分。如果設置為 0,則不允許拆分。預設為 1。
常用的方法有:
- add_command(options): 向選單中添加一個命令項目(點擊事件)。
- add_separator(): 向選單中添加分隔線。
- add_cascade(options, menu): 向選單中添加子選單。
- delete(index): 刪除選單中指定索引的項目。
- entryconfig(index, options): 配置選單項目的選項。
- insert_separator(index): 在選單中指定索引的位置插入分隔線。
範例原始碼:
Canvas:畫布

在 ttk 中沒有對應的主題化版本
Canvas 是用來在視窗上繪製和操作 2D 圖形的元件。常見的屬性有:
- width:Canvas 的寬度。
- height:Canvas 的高度。
- bg:Canvas 的背景色。
- bd:Canvas 的邊框寬度。
- highlightthickness:在 Canvas 被選取時的邊框寬度。
- relief: Canvas 的邊框樣式,可以是 tk.FLAT、tk.SUNKEN、tk.RAISED、tk.GROOVE 或 tk.RIDGE。
- scrollregion:定義了 Canvas 中可見區域的邊界,超出此區域的內容可以通過捲軸來查看。
- yscrollincrement:在垂直捲軸上的滑動增量。
- xscrollincrement:在水平捲軸上的滑動增量。
- yscrollcommand:指定與垂直捲軸關聯的命令。
- xscrollcommand:指定與水平捲軸關聯的命令。
常見的方法有:
- create_line:用於在 Canvas 上繪製直線。
- create_rectangle:用於在 Canvas 上繪製矩形。
- create_oval:用於在 Canvas 上繪製橢圓。
- create_text:用於在 Canvas 上插入文字。
- delete:用於刪除 Canvas 上的特定圖形或文字。
- move:用於移動 Canvas 上的圖形或文字。
- itemconfig:用於修改 Canvas 上圖形或文字的配置。
- bind:用於綁定事件處理器,讓 Canvas 具有互動性。
- create_image:用於在 Canvas 上插入圖片。
- config:用於設定 Canvas 的各種屬性。
- xview:用於在 Canvas 上水平方向上進行視窗滾動。
- yview:用於在 Canvas 上垂直方向上進行視窗滾動。
範例原始碼:https://gist.github.com/peterju/d25066a90249da74a25a1d6f41868dff
PanedWindow:窗格容器
PanedWindow 是 Tkinter 中的元件,用於建立具有可調整佈局的應用程式。它可以建立窗格,允許內部的 frame 以水平或垂直排列,並允許移動分隔線以調整各個 frame 的大小。以下是一些常用的屬性和方法:
常用屬性:
- orient:定義窗格的方向,可以是 tk.HORIZONTAL(水平)或 tk.VERTICAL(垂直)。
- handlesize:設定分隔線中的「手柄」(handle)尺寸。。
- sashrelief:定義分隔線的外觀,可以是 tk.RAISED、tk.SUNKEN、tk.FLAT、tk.GROOVE 或 tk.RIDGE。
- sashwidth:設定分隔線的寬度。
- opaqueresize:拉動分隔線時,分隔線是否採取不透明方式處理。預設為 True。
範例程式碼:
常用方法1
- add(child, options):向窗格中添加子控件,child 是要添加的子控件,options 是一個字典,用於指定窗格的配置選項。
- forget(child):從窗格中移除指定的子控件。
- cget(option):取得元件的屬性值,option指的是整個 PanedWindow 元件的全域配置選項,例如 handlesize、sashwidth 等。
- panes():返回窗格中所有子控件的列表。
程式碼範例:
常用方法2
- sash_place(index, x, y):設定指定分隔線的位置。
- sash_coord(index):獲取指定分隔線的位置。
- config():設定元件的屬性。
程式碼範例:
Tkinter 套件下的獨立模組
tkinter 除了標準的元件可供使用外,還有須單獨引入的模組功能,包含了
- ttk
- messagebox
- simpledialog
- scrolledtext
- filedialog
- colorchooser
- font
1. 外型現代化的 ttk 模組
ttk 模組是 tkinter 套件(Python的標準GUI工具包)中的一個模組,它提供了一組用於建立現代風格的 GUI 元件的工具。 ttk 代表 "themed Tkinter",意味著它支援主題樣式,可以讓你的應用程序在不同平台上看起來更加一致和現代。
tk模組元件 |
ttk模組元件 |
 |
 |
範例原始碼:https://gist.github.com/peterju/96c68bafaf0697021b8d593c20b8b988
ttk 模組的元件分為 2 類:
- 美化的原生元件
- 增加的新元件
1.1 ttk 美化的原生元件
ttk 美化了下列 12 種 Tkinter 的原生元件:
- Button (按鈕)
- Checkbutton (選擇框)
- Entry (輸入框)
- Frame (框架)
- Label (標籤)
- Labelframe (標籤框架)
- Menubutton (選單按鈕)
- PanedWindow (分格窗口)
- Radiobutton (單選按鈕)
- Scale (滑動條)
- Scrollbar(滾動條)
- Spinbox (數值調整/選單輸入框)

使用方法範例:https://gist.github.com/peterju/af41561f03f7aebd0b18d3325399d84f#file-ttk-py
1.2 ttk 增加的新元件
增加了下列 6 種元件
- Combobox (下拉選單)
- Notebook (頁籤)
- Progressbar (進度條)
- Separator (分隔線)
- Sizegrip(調整視窗尺寸的三角控點)
- Treeview (顯示樹狀或表格結構的資料)

使用方法範例:https://gist.github.com/peterju/af41561f03f7aebd0b18d3325399d84f#file-ttk-tk-py
上述每一個元件都還有自己的屬性與方法,請自行搜尋進行了解。
2. Messagebox:訊息視窗

常用於顯示標準的訊息或對話視窗,但不提供使用者輸入。它主要用於顯示消息、警告或錯誤訊息,並接受用戶的確認或回應。需要明確 import messagebox 模組才能使用,常用的方法如下:
- showinfo(title, message):顯示一個帶有標題和消息的【訊息】對話視窗。
- showwarning(title, message):顯示一個帶有標題和訊息的【警告】對話視窗。
- showerror(title, message):顯示一個帶有標題和訊息的【錯誤】對話視窗。
- askquestion(title, message):顯示一個帶有標題和訊息的【是/否】對話視窗,返回值是字串,可能的值有 "yes"、"no"。
- askokcancel(title, message):顯示一個帶有標題和訊息的【確定/取消】對話視窗,返回值是布林,可能的值有 True、False。
- askyesno(title, message):顯示一個帶有標題和訊息的【是/否】對話視窗,返回值是布林,可能的值有 True、False。
- askretrycancel(title, message):顯示一個帶有標題和訊息的【重試/取消】對話視窗,返回值是布林,可能的值有 True、False。
使用方法範例:
3. Simpledialog:對話視窗

simpledialog 模組是 Tkinter 中提供的一個用於顯示簡單對話視窗模組,主要用於獲取使用者輸入的文字、整數、浮點數等。
常用方法有:
- askstring(title, prompt, **kwargs):顯示一個用戶可以輸入【文字】的對話視窗。
- askinteger(title, prompt, **kwargs):顯示一個用戶可以輸入【整數】的對話視窗。
- askfloat(title, prompt, **kwargs):顯示一個用戶可以輸入【浮點數】的對話視窗。
使用方法範例:
simpledialog 還提供了一個 Dialog 類別,可以用來繼承建立自定義的對話框類別。
4. ScrolledText:捲動文字框
若想要有一個多列編輯的文字視窗,但不想處理文字視窗與滾動條元件的位置與關聯問題,則可使用 ScrolledText 元件。此元件需要明確 import scrolledtext 模組才能使用。

使用方法範例:
5. filedialog:檔案和目錄的選擇視窗
可讓使用者瀏覽檔案系統,選擇特定的檔案或目錄

常見的方法有
- askopenfilename(**options):顯示一個對話框,用戶可以選擇要打開的檔案。
- askopenfilenames(**options):顯示一個對話框,用戶可以選擇要打開的多個檔案。
- asksaveasfilename(**options):顯示一個對話框,用戶可以指定要儲存的檔案的名稱和位置。
- askdirectory(**options):顯示一個對話框,用戶可以選擇一個目錄。
使用方法範例:
import tkinter as tk
from tkinter import filedialog
from tkinter.scrolledtext import ScrolledText
def open_file():
file_path = filedialog.askopenfilename(
title="選擇檔案", filetypes=[("Text files", "*.txt"), ("All files", "*.*")]
)
if file_path:
show_selection(file_path)
def open_files():
file_paths = filedialog.askopenfilenames(
title="選擇多個檔案", filetypes=[("Text files", "*.txt"), ("All files", "*.*")]
)
if file_paths:
for file_path in file_paths:
show_selection(file_path)
def save_file():
file_path = filedialog.asksaveasfilename(
title="儲存檔案", filetypes=[("Text files", "*.txt"), ("All files", "*.*")]
)
if file_path:
show_selection(file_path)
def choose_directory():
dir_path = filedialog.askdirectory(title="選擇目錄", initialdir="/path/to/initial/directory")
if dir_path:
show_selection(dir_path)
def show_selection(selection):
result_text.insert(tk.END, selection + "\n")
form = tk.Tk()
form.title("FileDialog 範例")
form.geometry("300x300")
open_button = tk.Button(form, text="打開檔案", command=open_file)
open_button.grid(row=0, column=0, padx=10, pady=10)
open_files_button = tk.Button(form, text="打開多個檔案", command=open_files)
open_files_button.grid(row=0, column=1, padx=10, pady=10)
save_button = tk.Button(form, text="儲存檔案", command=save_file)
save_button.grid(row=1, column=0, padx=10, pady=10)
choose_directory_button = tk.Button(form, text="選擇目錄", command=choose_directory)
choose_directory_button.grid(row=1, column=1, padx=10, pady=10)
label = tk.Label(form, text="選擇:")
label.grid(row=2, column=0, columnspan=2, pady=5)
result_text = ScrolledText(form, height=11, width=35, wrap=tk.WORD)
result_text.grid(row=3, column=0, columnspan=2, padx=10, pady=5)
form.mainloop()
6. colorchooser:顏色選擇視窗
可讓使用者選擇顏色。

askcolor() 方法返回一個包含選擇顏色的 tuple,第一個元素是 RGB 顏色值,第二個元素是十六進位格式的顏色值。
範例程式碼:
進階
多視窗與統一事件處理
以下範例示範二個視窗共用事件處理函式的程式碼。
上述範例的學習重點:
- window.winfo_children()
- isinstance()
- event.widget
- event.widget.master
- event.widget.master.title()
- tk.mainloop()
參考資料