tkinter gui控件回調和grid布局優化

0、引子

Tkinter 是 Python 的標准 GUI 庫。Python 使用 Tkinter 可以快速的創建 GUI 應用程序。由於 Tkinter 是內置到 python 的安裝包中、只要安裝好 Python 之后就能 import Tkinter 庫，非常方便。

1、控件回調

1.1按鈕回調

import tkinter as tk

def printInfo():
    print("printInfo button click")

myWindow = tk.Tk()
myWindow.geometry('300x200')
myWindow.title('Python GUI Learning')
myWindow.resizable(width=False, height=False)
#Quit按鈕退出；Run按鈕打印計算結果
tk.Button(myWindow, text='Quit', command=myWindow.quit).grid(row=2, column=0,  padx=5, pady=5)
tk.Button(myWindow, text='Run', command=printInfo).grid(row=2, column=1,  padx=5, pady=5)
myWindow.mainloop()

 按下Run打印信息，按下Quit退出。

C:\Users\pwplu\AppData\Local\Programs\Python\Python37\python.exe E:/test1/test_opencv/test3.py
printInfo button click
printInfo button click

1.2單選框回調

r = tk.IntVar()
def radCall():
    print(f"radio:{r.get()}")

radio1=tk.Radiobutton(myWindow, text="one",value=1,variable=r,command=radCall).grid()
radio2=tk.Radiobutton(myWindow, text="two",value=2,variable=r,command=radCall).grid()

 選擇單選框后，觸發回調輸出：

C:\Users\pwplu\AppData\Local\Programs\Python\Python37\python.exe E:/test1/test_opencv/test3.py
radio:1
radio:1
radio:1
radio:2
radio:2

如果希望重復點擊同個單選框時不打印相同的內容，即只有值變化時候才觸發回調則需要修改回調函數，記錄當前的值即可：

prv = tk.IntVar()
r = tk.IntVar()
prv = -1
def radCall():
    global prv
    radSel = r.get()
    if radSel == 1 and prv != radSel:
        print(r.get())
    elif radSel == 2 and prv != radSel:
        print(r.get())
    prv = radSel

1.3滑動條回調與只在釋放時候觸發一次

def scaleFunc(v):
    print(f"radio:{v}")

scale1 = tk.Scale( myWindow, from_=1, to=100, length=100, orient=tk.HORIZONTAL, command = scaleFunc)
scale1.pack()
scale1.set(15)
scale2 = tk.Scale( myWindow, from_=1, to=100, length=150, orient=tk.VERTICAL, command = scaleFunc)
scale2.pack()
scale2.set(10)

當滑動條滑動時，會一直觸發回調函數，並且scaleFunc無法區分是哪一個滑動條動作觸發的動作。

一般地，希望不要反復觸發回調函數，而是釋放時觸發一次即可，並不需要中間的過程，以減少資源消耗。那么可以捕捉鼠標的操作，滑動條command參數無法完成這個功能，可以為滑動條綁定鼠標事件，鼠標松開時觸發一次。

def scaleFunc(event):
    print(f"radio:{event}, value={var1.get()}")

var1 = tk.IntVar()
scale1 = tk.Scale( myWindow, variable = var1, from_=1, to=100, length=100, orient=tk.HORIZONTAL)
scale1.pack()
scale1.set(15)
scale1.bind("<ButtonRelease-1>", scaleFunc)

輸出如下，調為1，改到85，再調到51，只觸發了3次。

radio:<ButtonRelease event state=Mod1|Button1 num=1 x=5 y=31>, value=1
radio:<ButtonRelease event state=Mod1|Button1 num=1 x=74 y=30>, value=85
radio:<ButtonRelease event state=Mod1|Button1 num=1 x=47 y=33>, value=51

2、grid布局

在一個小工具項目中，出現了界面布局的問題，grid按照行列對齊方式布局。

因為不同的元素尺寸不同，導致下面的單色選項的R-G-B二級選項，單選框無法對齊。第6行RGB分別對齊1,2,3列，但是低二列和第三列跑到最右側，第一列需要對齊圖像中心，那么第二列就會出現的圖像空間的右側，無法挨着紅色單選框連續排列。

radio5r=tk.Radiobutton(myWindow, text="紅色",  value=51, variable=r, command=radCall5r)
radio5g=tk.Radiobutton(myWindow, text="綠色",  value=52, variable=r, command=radCall5g)
radio5b=tk.Radiobutton(myWindow, text="藍色",  value=53, variable=r, command=radCall5b)
radio5r.grid(row=6, column=1, sticky=tk.W, ipadx = 15)
radio5g.grid(row=6, column=2, sticky=tk.W, ipadx = 15)
radio5b.grid(row=6, column=3, sticky=tk.W, ipadx = 15)
 

這個問題怎么解決？可以添加一個frame空間，把R-G-B二級單選框當做一個整體處理，frame排列在第一列即可。

group = tk.LabelFrame(myWindow, text="R-G-B")
group.grid(row=6, column=1, sticky=tk.W, ipadx = 5)

radio5r=tk.Radiobutton(group, text="紅色",  value=51, variable=r, command=radCall5r)
radio5g=tk.Radiobutton(group, text="綠色",  value=52, variable=r, command=radCall5g)
radio5b=tk.Radiobutton(group, text="藍色",  value=53, variable=r, command=radCall5b)

  另外若去除R-G-B二級組合的Frame的外框，則就實現了三個單選框按順序緊湊排列的效果。

group = tk.LabelFrame(myWindow, borderwidth =0) #邊框為0就看不到邊框了
group.grid(row=6, column=1, sticky=tk.W, ipadx = 5)

 3、附錄

1）Tkinter組件

 2）Grid結構管理器的參數

4、參考文檔

1、Python——交互式圖形編程

https://www.cnblogs.com/ruo-li-suo-yi/p/7420738.html

2、Python Tkinter grid() Method

https://www.tutorialspoint.com/python3/tk_grid.htm