Python GUI設計——tkinter菜鳥編程（上）

GUI英文全稱是Graphical User Interface，中文為圖形用戶接口。

tkinter是一個開放源碼的圖形接口開發工具，在安裝Python時，就已經同時安裝此模塊了，在使用前只需要導入即可。

import tkinter
print(tkinter.TkVersion)

8.6

1. 建立窗口

from tkinter import *
root = Tk()
root.mainloop()

通常將使用Tk()方法建立的窗口稱為根窗口，默認名稱是tk，之后可以在此根窗口中建立許多控件，也可以在此根窗口中建立上層窗口。mainloop()方法讓程序繼續執行，同時進入等待與處理窗口事件，單擊窗口的"關閉"按鈕，此程序才會結束。

與窗口相關的方法：

方法	說明
title()	可以設置窗口的標題
geometry("widthxheight+x+y")	設置窗口寬width與高height，單位是像素，設定窗口位置
maxsize(width,height)	拖曳時窗口最大的寬和高
minsize(width,height)	拖曳時窗口最小的寬和高
configure(bg="color")	設置窗口的背景顏色
resizable(True,Ture)	可設置是否可更改窗口大小，第一個參數是寬，第二個參數是高，如果要固定窗口寬與高，可以使用resizable(0,0)
state("zoomed")	最大化窗口
iconify()	最小化窗口
iconbitmap("xx.ico")	更改默認窗口圖標

root = Tk()
root.title("MyWindow")
root.geometry("300x160+400+200")
root.configure(bg="#33ff33")
root.iconbitmap("mystar.ico")
root.mainloop()

geometry中width和height用x分隔，表示窗口的寬和高，+x是窗口左邊距離屏幕左邊的距離，如果是-x則是表示窗口右邊距離屏幕右邊的距離，同理，+y或-y表示窗口上邊（下邊）距離屏幕上邊（下邊）的距離。

在tkinter模塊中可以使用下列方法獲得屏幕的寬度和高度：

• winfo_screenwidth()：屏幕寬度；
• winfo_screenheight()：屏幕高度。

下面的程序將窗口顯示在屏幕中央。

root = Tk()
screenWidth = root.winfo_screenwidth()
screenHeight = root.winfo_screenheight()
w = 300
h = 160
x = (screenWidth - w) / 2
y = (screenHeight -h) / 2
root.geometry("%dx%d+%d+%d" % (w,h,x,y))
root.mainloop()

2. tkinter的Widget

Widget可以翻譯為控件或組件或部件。窗口建立完成后，下一步就是在窗口內建立控件。

控件

• Button：按鈕；
• Canvas：畫布；
• Checkbutton：多選按鈕；
• Entry：文本框；
• Frame：框架；
• Label：標簽；
• LabelFrame：標簽框架；
• Listbox：列表框；
• Menu：菜單；
• Message：消息；
• OptionMenu：下拉菜單；
• PanedWindow：面板；
• Radiobutton：單選按鈕；
• Scale：尺度；
• Scrolbar：滾動條；
• Spinbox：可微調輸入控件；
• Text：文字區域；
• Toplevel：上層窗口。

加強版模塊tkinter.ttk中新增的Widget：

• Combobox；
• Notebook；
• Progressbat；
• Separator；
• Sizegrip；
• Treeview。

Widget的共同屬性：

• Dimensions：大小；
• Colors：顏色；
• Fonts：字體；
• Anchor：錨（位置參考點）；
• Relief styles：屬性邊框；
• Bitmaps：顯示位圖；
• Cursors：鼠標外形。

Widget的共同方法：

1. Configuration
   • config(option=value)：Widget屬性可以在建立時設置，也可以在程序執行時使用config()重新設置；
   • cget("option")：取得option參數值；
   • keys()：可以用此方法獲得所有該Widget的參數。
2. Event Processing
• mainloop()：讓程序繼續執行，同時進入等待與處理窗口事件；
• quit()：Python Shell窗口結束，但是所建立的窗口繼續執行；
• update()：更新窗口畫面。
3. Event callbacks
• bind(event,callback)：事件綁定；
• unbind(event)：接觸綁定。
4. Alarm handlers
• after(time,callback)：間隔指定時間后調用callback()方法。

3. 標簽

Label()方法用於在窗口內建立文字或圖像標簽。

Label(父對象,options,…)

常用options參數：

• anchor：如果空間大於所需時，控制標簽的位置，默認是CENTER（居中）；√ 3.2
• bg或background：背景顏色；√ 3.1
• bitmap：使用默認圖標當做標簽內容；√ 3.6
• borderwidth或bd：標簽邊界寬度，默認為1；
• compound：可以設置標簽內含圖形和文字時，彼此的位置關系；√ 3.7
• cursor：當鼠標光標在標簽上方時的外形；√ 3.12
• fg或foreground：前景顏色；√ 3.1
• font：可選擇字形、字形樣式與大小；√ 3.4
• height：標簽高度，單位是字符；√ 3.1
• image：標簽以圖形形式呈現；√ 3.10
• justify：存在多行文本時最后一行的對齊方式，可取left/center（默認）/right；√ 3.5
• padx/pady：標簽文字與標簽區間的間距，單位是像素；√ 3.9
• relief：默認為FLASE，可控制標簽的外框；√ 3.8
• text：標簽文字內容，使用\n可輸入多行；√ all
• textvariable：可以設置標簽以變量的形式顯示；
• underline：可以設置第幾個文字有下划線，從0開始，默認為-1，表示無下划線；
• width：標簽寬度，單位是字符；√ 3.1
• wraplength：文本到多少寬度后換行，單位是像素。√ 3.3

3.1 Color、Dimensions

Widget的共同屬性。

bg、fg設置背景、前景色。

width、height的單位是字符。

root = Tk()
root.title("Ex")
root.geometry("200x80")
label = Label(root, text = "I like tkinter", \
              bg = "#EF72AA", fg = "white", \
              height = 3, width = 20)
label.pack() #包裝與定位組件
root.mainloop()

3.2 Anchor

Widget的共同屬性。

Anchor是指標簽文字在標簽區域的輸出位置。

比如nw效果如下：

anchor的參數設置也可以使用NW、N、NE、W等大寫常數，同時省略字符串的雙引號。

3.3 Wraplength

wraplength = 35

效果如下：

3.4 Font

Widget的共同屬性。

用於設置文字字形。

1. family：字形，如Helvetica、Times等；
2. size：字號，單位是像素；
3. weight：如bold、normal；
4. slant：如italic、roman；
5. underline：True、False；
6. overstrike：True、False。

root = Tk()
root.title("Ex")
label = Label(root, text = "I like tkinter", \
              bg = "#EF72AA", fg = "white", \
              height = 3, width = 20, \
              font = "Helnetic 20 bold italic")
#             font = ("Helnetic", 20, "bold", "italic"))
label.pack() #包裝與定位組件
root.mainloop()

height和width都是字號聯動的。

3.5 Justify

justify = "right"

3.6 Bitmaps

Widget的共同屬性。

在標簽位置放置內建位圖。

error、hourglass、info、questhead、question、warning、gray12、gray25、gray50、gray75

label = Label(root, bitmap = "question")

3.7 Compound

圖像與文字共存時，使用此參數定義文字與圖像的位置關系。

• left：圖像在左；
• right：圖像在右；
• top：圖像在上；
• bottom：圖像在下；
• center：文字覆蓋在圖像上方。

label = Label(root, bitmap = "question", text = "Question", \
               compound = "left")

3.8 Relief

Widget的共同屬性。

用於建立Widget的邊框。

label = Label(root, text = "raised", \
               relief = "raised")

3.9 Padx/Pady

padx用於設置標簽文字左右邊界與標簽區間的x軸間距，pady用於設置文字上下邊界與標簽取件單y軸間距。

與width和height作用相似，可以互相替代。

root.geometry("300x100")
label = Label(root, text = "raised", \
               bg = "lightyellow", relief = "raised", \
               padx = 5, pady = 10)

3.10 Image

圖片可以應用在許多地方，例如標簽、功能按鈕、選項按鈕文字區域等。在使用前可以使用PhotoImage()方法建立圖像對象，然后再將此對象應用在其他窗口組件上。

imageobj = PhotoImage(file = "xxx.gif")

png也可。

image_obj = PhotoImage(file = "mystar.png")
label = Label(root, image = image_obj)

jpg無法直接解析：

需要借助PIL模塊。

from tkinter import *
from PIL import Image, ImageTk
root = Tk()
root.title("Ex")
image_obj = Image.open("scenery.jpg")
jpg_obj = ImageTk.PhotoImage(image_obj)
label = Label(root, image = jpg_obj)
label.pack() #包裝與定位組件
root.mainloop()

注意：bitmap和image不能共存。

3.11 Cursors

Widget的共同屬性。

表示光標形狀，實際形狀可能會因操作系統不同而有所差異。

3.12 keys()

Widget的共同方法。

可以以列表的形式傳回Widget的所有參數。

root = Tk()
root.title("Ex")
label = Label(root, text = "tkinter")
label.pack()
print(label.keys())

['activebackground', 'activeforeground', 'anchor', 'background', 'bd', 'bg', 'bitmap', 'borderwidth', 'compound', 'cursor', 'disabledforeground', 'fg', 'font', 'foreground', 'height', 'highlightbackground', 'highlightcolor', 'highlightthickness', 'image', 'justify', 'padx', 'pady', 'relief', 'state', 'takefocus', 'text', 'textvariable', 'underline', 'width', 'wraplength']

3.13 config()

Widget的共同方法。

Widget控件在建立時可以直接設置對象屬性，若是部分屬性未建立，未來在程序執行時可以使用config()方法建立或更改屬性。此方法內屬性設置的參數用法與建立時相同。

計數器：

from tkinter import *

counter = 0
def run_counter(digit):
    def counting():
        global counter
        counter += 1
        digit.config(text=str(counter))
        digit.after(1000,counting)
    counting()

root = Tk()
root.title("Ex")

digit = Label(root, bg = "yellow", \
              height = 3, width = 10, \
              font = "Helvetic 20 bold")
digit.pack()
run_counter(digit)
root.mainloop()

3.14 Separator

用於添加分隔線。

Separator(父對象,options)

options為HORIZONTAL表示建立水平分隔線，VERTICAL表示建立垂直分隔線。

from tkinter import *
from tkinter.ttk import Separator
root = Tk()
root.title("Ex")

myTitle = "我喜歡Tkinter"
myContent = """今天，我開始學習Tkinter。
Tkinter 是 Python 的標准 GUI 庫，
Python 使用 Tkinter 可以快速的創建 GUI 應用程序。"""
label1 = Label(root, text = myTitle, font = "Helvetic 20 bold")
label1.pack(padx = 10, pady = 10)
sep = Separator(root, orient = HORIZONTAL)
sep.pack(fill = X, padx = 5)
label2 = Label(root, text = myContent)
label2.pack(padx = 10, pady = 10)
root.mainloop()

4. 窗口控件配置管理員

4.1 簡介

Widget Layout Manager用於將多個Widget控件配置到容器或窗口內，有3中方法：

1. pack；
2. grid；
3. place。

4.2 pack

最常用的控件配置管理員，使用相對位置類處理控件，至於控件的正確位置則是由pack方法自動完成的。

pack(options,…)

-after, -anchor, -before, -expand, -fill, -in, -ipadx, -ipady, -padx, -pady, -side

1. side

用於水平或垂直配置控件。

• TOP：默認值，從上到下排列；
• BOTTOM：從下到上排列；
• LEFT：從左到右排列；
• RIGHT：從右到左排列。

root = Tk()
root.title("Ex")

label1 = Label(root, text = "哈爾濱工業大學", \
               bg = "lightyellow", width = 30)
label2 = Label(root, text = "哈爾濱工程大學", \
               bg = "lightgreen", width = 15)
label3 = Label(root, text = "東北林業大學", \
               bg = "lightblue", width = 15)
label1.pack(side = BOTTOM)
label2.pack(side = RIGHT)
label3.pack(side = LEFT)
root.mainloop()

列出所有的relief屬性：

root = Tk()
root.title("Ex")

Reliefs = ["flat", "groove", "raised" ,"ridge", "solid", "sunken"]
for Relief in Reliefs:
    Label(root, text = Relief, relief = Relief, \
          fg="darkgreen", font = "Times 20 bold").pack(side = LEFT, padx = 5)
root.mainloop()

列出所有的位圖：

root = Tk()
root.title("Ex")

bitMaps = ["error", "hourglass", "info", "questhead", "question", \
           "warning", "gray12", "gray25", "gray50", "gray75"]
for bitMap in bitMaps:
    Label(root, bitmap = bitMap).pack(side = LEFT, padx = 5)
root.mainloop()

2. padx/pady

設定控件邊界與容器或其他控件邊界之間的距離。默認為1。

3. ipadx/ipady

控制文字與標簽容器的x/y軸間距。

4. anchor

設定Widget控件在窗口中的位置

root = Tk()
root.title("Ex")
root.geometry("300x180")
label1 = Label(root, text = "Next", \
               font = "Times 15 bold", 
               fg = "white", bg = "blue")
label2 = Label(root, text = "Previous", \
               font = "Times 15 bold", 
               fg = "white", bg = "red")
label1.pack(anchor = S, side = RIGHT, \
            padx = 10, pady = 10)
label2.pack(anchor = S, side = RIGHT, \
            padx = 10, pady = 10)
root.mainloop()

5. fill

設置控件填滿所分配容器的方式。

• fill = X：填滿所分配空間的X軸不留白；
• fill = Y：填滿Y軸不留白；
• fill = BOTH：填滿X軸和Y軸；
• fill = NONE：默認值，保持原大小。

如果所分配容器區間已經滿了，則使用fill參數不會有任何作用。

root = Tk()
root.title("Ex")

label1 = Label(root, text = "哈爾濱工業大學", \
               bg = "lightyellow")
label2 = Label(root, text = "哈爾濱工程大學", \
               bg = "lightgreen")
label3 = Label(root, text = "東北林業大學", \
               bg = "lightblue")
label1.pack(side = LEFT, fill = Y)
label2.pack()
label3.pack(fill = X)
root.mainloop()

6. expend

設定Widget控件是否填滿額外的父容器界面，默認為False。

label2.pack(fill = BOTH, expand = True)

7. pack的方法

pack其實在tkinter中也是一個類別，有以下方法可供使用：

• slaves()：傳回所有的Widget控件對象；
• info()：傳回pack選項的對應值；
• forget()：隱藏Widget控件，可以用pack(opions,…)復原顯示；
• location(x,y)：傳回此點是否在單元格，如果是傳回坐標，如果不是傳回(-1,-1)；
• size()：傳回Widget的控件大小；
• propagate()：參數是True表示父窗口大小由子控件決定，默認為True。

print(root.pack_slaves())

[<tkinter.Label object .!label>, <tkinter.Label object .!label2>, <tkinter.Label object .!label3>]

4.3 grid

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

grid(opions,…)

-column, -columnspan, -in, -ipadx, -ipady, -padx, -pady, -row, -rowspan, -sticky

1. row、column

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

2. rowspan、columnspan

可以設定row或column方向的合並數量。

3. padx/pady

與pack方法中的參數相同。

4. sticky

類似於anchor，只能設定N/S/W/E，即上/下/左/右對齊，但可以組合使用。

• N+W：左上角；
• N+E：右上角；
• S+W：左下角；
• S+E：右下角；
• N+S：拉長高度讓控件在頂端和底端對齊；
• W+E：拉長寬度讓控件在左邊和右邊對齊；
• N+S+W：頂端和底端對齊，切齊左邊；
• N+S+E：頂端和底端對齊，切齊右邊；
• W+E+N：左邊和右邊對齊，切齊頂端；
• W+E+S：左邊和右邊對齊，切齊底端；
• N+S+W+E：拉伸平鋪。

5. rowconfigure()、columnconfigure()

用於設定某行或列在窗口縮放大小時的縮放比例。

rowconfigure(0, weight = 1) #row 0 的控件在窗口改變大小時縮放比是1

columnconfigure(0, weight = 1) #column 0 的控件在窗口改變大小時縮放比是1

root = Tk()
root.title("Ex")
root.rowconfigure(0,weight=1)
root.columnconfigure(1,weight=1)
label1 = Label(root, text = "哈爾濱工業大學", \
               bg = "lightyellow")
label2 = Label(root, text = "哈爾濱工程大學", \
               bg = "lightgreen")
label3 = Label(root, text = "東北林業大學", \
               bg = "lightblue")
label1.grid(row = 0, column = 0, sticky = N+S)
label2.grid(row = 1, column = 0)
label3.grid(row = 1, column = 1, sticky = W+E)
root.mainloop()

6. grid方法

建立色彩標簽：

root = Tk()
root.title("Ex")

Colors = ["red", "orange", "yellow", "green","cyan", "blue", "purple"]
r = 0
for color in Colors:
    Label(root, text = color, relief = "groove", width = 20).grid(row = r, column = 0)
    Label(root, bg = color, relief = "ridge", width = 20).grid(row = r,column = 1)
    r += 1

root.mainloop()

4.4 place

使用直接指定方式將Widget控件放在容器中的方法。

place(options,…)

1. x/y

直接設定控件左上角位置，單位是像素。

窗口區左上角是(x=0,y=0)，x向右遞增，y向下遞增。

2. width/height

在插入圖片的同時設定圖片的大小。

from PIL import Image, ImageTk
root = Tk()
#root=Toplevel()
root.title("Ex")
root.geometry("520x520")

flower = ImageTk.PhotoImage(Image.open("flower.jpg"))
scenery = ImageTk.PhotoImage(Image.open("scenery.jpg"))
p1 = Label(root, image = flower)
p2 = Label(root, image = scenery)
p1.place(x=20, y=20, width = 200, height = 200)
p2.place(x=240, y=240, width = 260, height = 260)
root.mainloop()

3. relx/rely、relwidth/relheight

relx/rely用於設置相對於父容器的位置，relwidth/relheight用於設置相對於父容器的大小，取值為0~1.0。

5. 功能按鈕Button

在窗口組件中可以設計在單擊功能按鈕時，執行某一個特定的動作，這個動作也稱為callback方法。

Button(父對象,options,…)

常用的options參數：

• borderwidth或bd：邊界寬度，默認2像素；
• bg或background：背景色彩；
• command：單擊功能按鈕時，執行此方法；
• cursor：當鼠標光標移至按鈕上時的形狀；
• fg或foreground：前景色彩；
• font：字形；
• height：高，單位是字符；
• highlightbackground：當功能按鈕取得焦點時的背景色彩；
• highlightcolor：當功能按鈕取得焦點時的色彩；
• image：功能按鈕上的圖像；
• justify：當有多行文字時，最后一行文字的對齊方式；
• padx/pady：默認為1；
• relief：默認為FLAT；
• state：默認為NORMAL，若設置為DISABLED則以灰階顯示按鈕表示無法使用；
• text：功能按鈕文字；
• underline：設置第幾個文字有下划線；
• width：寬，單位是字符；
• wraplength：限制每行的字符數。

5.1 示例

def msgShow():
    label["text"] = "I love tkinter."
    label["bg"] = "lightyellow"
    label["fb"] = "blue"
    label.config(text = "I love tkinter.", 
                 bg = "lightyellow", fg = "blue")
root = Tk()
root.title("Ex")
label = Label(root)
btn1 = Button(root, text = "Show Message", width = 15, command = msgShow)
btn2 = Button(root, text = "Exit", width = 15, command = root.destroy)
label.pack()
btn1.pack(side = LEFT)
btn2.pack(side = LEFT)
root.mainloop()

5.2 Lambda

def bColor(bgColor):
    root.config(bg = bgColor)
root = Tk()
root.title("Ex")
root.geometry("300x200")
#建立3個按鈕
bluebtn = Button(root, text = "Blue", command = lambda:bColor("blue"))
yellowbtn = Button(root, text = "Yellow", command = lambda:bColor("yellow"))
exitbtn = Button(root, text = "Exit", command = root.destroy)
exitbtn.pack(anchor = S, side = RIGHT, padx = 5, pady = 5)
yellowbtn.pack(anchor = S, side = RIGHT, padx = 5, pady = 5)
bluebtn.pack(anchor = S, side = RIGHT, padx = 5, pady = 5)
root.mainloop()

6. 文本框Entry

通常是指單行文本框，是GUI設計中用於輸入的最基本的Widget控件，可以用來輸入單行字符串。

如果輸入的字符串長度大於文本框的寬度，輸入的文字會自動隱藏造成部分內容無法顯示出來，此時可以使用箭頭鍵移動鼠標光標到看不到的區域。

如果需要處理多行文字，則需要使用Text。

Entry(父對象,options,…）

常用的options參數：

• bg，bd，cursor，fg，font，height，highlightbackground，highlightcolor，justify，relief，width；
• command：當用戶更改內容時，會自動執行此函數；
• exportselection：選取的字符串自動輸出至剪切板，使用exportselection = 0來避免；
• selectbackground：被選取字符串時的背景色彩；
• selectborderwidth：被選取字符串時的邊界寬度，默認為1；
• selectforeground：被選取字符串時的前景色彩；
• show：顯示輸入字符，例如show = '*'表示顯示星號，常用於輸入密碼；
• state：輸入狀態，默認NORMAL表示可以輸入，DISABLE表示無法輸入；
• textvariable：文字變量；
• xscrollcommand：在x軸使用滾動條。

6.1 示例

root = Tk()
root.title("Ex")
accountL = Label(root, text = "Account:")
accountL.grid(row = 0)
passwordL = Label(root, text = "Password:")
passwordL.grid(row = 1)

accountE = Entry(root)
accountE.grid(row = 0,column = 1)
passwordE = Entry(root, show = '*')
passwordE.grid(row = 1, column = 1)
root.mainloop()

6.2 get()

用於獲取目前Entry的字符串內容。

def printInfo():
    print("Account:%s\nPassword:%s" % \
          (accountE.get(), passwordE.get()))
...
loginbtn = Button(root, text = "Login", command = printInfo)
loginbtn.grid(row = 3)
quitbtn = Button(root, text = "Quit", command = root.destroy)
quitbtn.grid(row = 3, column = 1)
root.mainloop()

Account:叮叮當當sunny
Password:123456789abcdefg

6.3 insert()

用於建立默認文字。

insert(index,s) #將字符串s插入在index位置

accountE.insert(0, "Kevin")
passwordE.insert(0, "pwd123")

6.4 delete()

用於刪除文字。

delete(first,last = None) #刪除從第first到第last-1字符之間的字符串（last = None則僅刪除第first個字符）

delete(0,END) #刪除文本框內整個字符串

6.5 eval()

用於將字符串轉換為Python語句執行，可以直接計算數學表達式。

result = eval(expression) #expression是字符串

數學表達式計算：

from tkinter import *
import numpy as np
def cal():
    out.configure(text = "結果：" + str(eval(equ.get())))
root = Tk()
root.title("Ex")
label = Label(root, text = "請輸入數學表達式：")
label.pack()
equ = Entry(root)
equ.pack(padx = 20, pady = 5)
out = Label(root)
out.pack()
btn = Button(root, text = "計算", command = cal)
btn.pack(pady = 5)
root.mainloop()

7. 變量類型

要將Widget控件的參數以變量方式處理時，需要借助tkinter模塊內的變量類別，這個類別有4個子類別，每一個類別其實是一個數據類型的構造方法，我們可以通過這4個子類別的數據類型將它們與Widget控件的相關參數結合。

• x = IntVar() #整型變量，默認是0
• x = DoubleVar() #浮點型變量，默認是0.0
• x = StringVar #字符串變量，默認是""
• x = BooleanVar() #布爾型變量

7.1 get()、set()

使用get()方法取得變量內容，使用set()方法設置變量內容。

msg_on = False
def btn_hit():
    global msg_on
    if msg_on == False:
        msg_on = True
        x.set("I like tkinter")
    else:
        msg_on = False
        x.set("")
root = Tk()
root.title("Ex")
x = StringVar()
label = Label(root, textvariable = x, \
              fg = "blue", bg = "lightyellow", \
              font = "Verdana 15 bold", \
              width = 25, height = 2)
label.pack()
btn = Button(root, text = "Show", command = btn_hit)
btn.pack(pady = 5)
root.mainloop()

def btn_hit():
     if x.get() == "":
         x.set("I like tkinter")
     else:
         x.set("")

7.2 trace()

利用變量追蹤Widget控件，當其內容更改時，讓程序執行callback函數。

def callback(*args):
    print("data changed:",xE.get())
root = Tk()
root.title("Ex")
xE = StringVar()
entry = Entry(root, textvariable = xE)
entry.pack()
xE.trace('w', callback)
root.mainloop()

data changed: t
data changed: tk
data changed: tki
data changed: tkin
data changed: tkint
data changed: tkinte
data changed: tkinter

w表示當寫入時，自動執行callback函數，這個動作稱為變動追蹤。

r表示當控件內容被讀取時，執行特定函數。

def callbackW(*args):
    xL.set(xE.get())
def callbackR(*args):
    print("Waring:數據被讀取!")
def hit():
    print("讀取數據:", xE.get())
root = Tk()
root.title("Ex")
xE = StringVar()
entry = Entry(root, textvariable = xE)
entry.pack(padx = 20, pady = 5)
xE.trace('w', callbackW)
xE.trace('r', callbackR)
xL = StringVar()
label = Label(root, textvariable = xL)
xL.set("同步顯示")
label.pack(padx = 20, pady = 5)
btn = Button(root, text = "讀取", command = hit)
btn.pack(padx = 20, pady = 5)
root.mainloop()

Waring:數據被讀取!
讀取數據: tkinter

callback函數其實有3個參數：tk變量名稱、index索引、mode模式。

7.3 計算器

def calculate():
    r = re.findall(".+", equ.get())
    result = eval(str(r[-1]))
    equ.set(equ.get() + "\n" + str(result))
def show(buttonString):
    content = equ.get()
    if content == "0":
        content = ""
    equ.set(content + buttonString)
def backspace():
    equ.set(str(equ.get()[:-1]))
def clear():
    equ.set("0")
    
root = Tk()
root.title("calculator")
equ = StringVar()
equ.set("0") #默認顯示0
#顯示區
label = Label(root, width = 25, height = 2, relief = "raised", \
              anchor = SE, textvariable = equ)
label.grid(row = 0, column = 0, columnspan = 4, padx = 5, pady = 5)
#按鈕設計
Button(root, text = "C", fg = "blue", width = 5, \
       command = clear).grid(row = 1, column = 0)
Button(root,text="DEL",width=5,command=backspace).grid(row=1,column=1)
Button(root,text="%",width=5,command=lambda:show("%")).grid(row=1,column=2)
Button(root,text="/",width=5,command=lambda:show("/")).grid(row=1,column=3)
Button(root,text="7",width=5,command=lambda:show("7")).grid(row=2,column=0)
Button(root,text="8",width=5,command=lambda:show("8")).grid(row=2,column=1)
Button(root,text="9",width=5,command=lambda:show("9")).grid(row=2,column=2)
Button(root,text="*",width=5,command=lambda:show("*")).grid(row=2,column=3)
Button(root,text="4",width=5,command=lambda:show("4")).grid(row=3,column=0)
Button(root,text="5",width=5,command=lambda:show("5")).grid(row=3,column=1)
Button(root,text="6",width=5,command=lambda:show("6")).grid(row=3,column=2)
Button(root,text="-",width=5,command=lambda:show("-")).grid(row=3,column=3)
Button(root,text="1",width=5,command=lambda:show("1")).grid(row=4,column=0)
Button(root,text="2",width=5,command=lambda:show("2")).grid(row=4,column=1)
Button(root,text="3",width=5,command=lambda:show("3")).grid(row=4,column=2)
Button(root,text="+",width=5,command=lambda:show("+")).grid(row=4,column=3)
Button(root, text="0", width=12, \
       command = lambda:show("0")).grid(row = 5, column = 0, columnspan = 2)
Button(root, text=".", width=5, \
       command = lambda:show(".")).grid(row = 5, column = 2)
Button(root, text="=", bg = "lightyellow", width=5, \
       command = calculate).grid(row = 5, column = 3)

root.mainloop()