tkinter的GUI設計：界面與邏輯分離（一）-- 初次見面

PyQt實現界面與邏輯分離的設計很是方便，詳情可以見我的第一篇博文。

 

不過本文將使用python的標准庫 tkinter，來實現界面與邏輯分離的GUI 設計。

 

我們來設計一個很簡單的程序：

　　目的：長度單位英尺(feet)到米(meter)的轉化

　　實現：輸入框輸入英尺(feet)，標簽顯示對應的長度米(meter)。可以點擊按鈕，亦可按回車鍵。

　　說明：界面使用了 ttk.Frame 容器，各個部件的定位皆使用了 grid() 方法，3行3列

                   

　　效果：如下

                       

　　代碼： 眼力好的你一定會發現，下面的代碼風格有點像PyQt：

import tkinter as tk
from tkinter import ttk


class Application(tk.Tk): # 繼承自 tk.Tk
    '''界面、邏輯分離示例'''
    
    def __init__(self):
        '''初始化'''
        super().__init__() # 有點相當於tk.Tk()
        
        self.createWidgets()

    def createWidgets(self):
        '''界面'''
        self.mainframe = ttk.Frame(self, padding="3 3 12 12") # 注意ttk.Frame()的第一個參數為self，因為這個類繼承自tk.Tk類
        self.mainframe.grid(column=0, row=0, sticky=(tk.N, tk.W, tk.E, tk.S))
        self.mainframe.columnconfigure(0, weight=1)
        self.mainframe.rowconfigure(0, weight=1)

        # 定義了兩個變量（下面會將它們綁定到輸入部件 Entry 和標簽部件 Label 上）
        # self.feet = StringVar()
        self.feet = tk.DoubleVar()
        self.meters = tk.StringVar()

        # 定義Entry部件，並把它賦給一個變量，方便在別處引用它。
        self.feet_entry = ttk.Entry(self.mainframe, width=7, textvariable=self.feet)
        self.feet_entry.grid(row=1, column=2, sticky=(tk.W, tk.E))
        self.feet_entry.focus()

        # 定義Label部件
        ttk.Label(self.mainframe, textvariable=self.meters).grid(row=2, column=2, sticky=(tk.W, tk.E))
        
        # 定義Button部件
        ttk.Button(self.mainframe, text="Calculate", command=self.calculate).grid(row=3, column=3, sticky=tk.W)

        # 定義三個Label部件
        ttk.Label(self.mainframe, text="feet").grid(row=1, column=3, sticky=tk.W)
        ttk.Label(self.mainframe, text="is equivalent to").grid(row=2, column=1, sticky=tk.E)
        ttk.Label(self.mainframe, text="meters").grid(row=2, column=3, sticky=tk.W)
        
        # 設置每格的 padding
        for child in self.mainframe.winfo_children(): 
            child.grid_configure(padx=5, pady=5)
            
        
        # 給窗口綁定回車鍵事件
        self.bind('<Return>', self.calculate)

    
    def calculate(self, *args): # 注意：參數必須是帶!星!號!的 *args. 否則無論如何都會報類型錯誤：TypeError
        '''邏輯'''
        try:
            #value = float(self.feet.get()) # 如果前面定義為stringVar: self.feet = StringVar()
            value = self.feet.get()
            self.meters.set('{:.4f}'.format((0.3048 * value * 10000.0 + 0.5)/10000.0))
        except ValueError:
            pass


if __name__ == '__maint__':
    # 實例化Application
    app = Application()
    
    # 設置窗口標題
    app.title("Feet to Meters")
    
    # 主消息循環:
    app.mainloop()

 

 

參考：

http://www.360doc.com/content/14/0328/02/9482_364311622.shtml

http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/0013868326118089581a091a04e4c30b2b7896392bdde5c000