學Python這麼久了,一直想做個界面出來,最近發現Python有個內置庫tkinter,利用它可以很輕鬆做出一些簡易的UI界面 關註公眾號「**Python專欄**」,後臺回覆關鍵字:**zsxq03**,獲取本文全部代碼 ...
0.引言
學Python這麼久了,一直想做個界面出來,最近發現Python有個內置庫tkinter,利用它可以很輕鬆做出一些簡易的UI界面,首先來看Python官方對Tkinter的說明:
The tkinter package (“Tk interface”) is the standard Python interface to the Tk GUI toolkit. Both Tk and tkinter are available on most Unix platforms, as well as on Windows systems.
從上面描述中我們不難看出,不管你是 Mac OS 系統,還是 Windows 系統,它都可以生成相對應的操作界面,這就是所謂的跨平臺。
1.調用關係說明
其原理就是我們使用 Python代碼去調用 Tkinter, Tkinter 已經封裝了訪問TK的介面,這個介面是一個圖形庫,支持多跨平臺操作系統,進而通過它,我們就可以調用我們系統本身的GUI介面了。
2.環境
操作系統:Windows / Linux / Mac OS
Python版本:3.6.6
3.小試牛刀
有了概念並瞭解原理之後,接下來就小試牛刀一下~
import tkinter as tk
import tkinter.messagebox as mbox
# 定義MainUI類表示應用/視窗,繼承Frame類
class MainUI(tk.Frame):
# Application構造函數,master為視窗的父控制項
def __init__(self, master = None):
# 初始化Application的Frame部分
tk.Frame.__init__(self, master)
# 顯示視窗,並使用grid佈局
self.grid()
# 創建控制項
self.createWidgets()
# 創建控制項
def createWidgets(self):
# 創建一個標簽,輸出要顯示的內容
self.firstLabel = tk.Label(self,text="「人人都是Pythonista」專註Python領域,做最專業的Python星球。")
# 設定使用grid佈局
self.firstLabel.grid()
# 創建一個按鈕,用來觸發answer方法
self.clickButton = tk.Button(self,text="點一下瞧瞧?",command=self.answer)
# 設定使用grid佈局
self.clickButton.grid()
def answer(self):
# 我們通過 messagebox 來顯示一個提示框
mbox.showinfo("「人人都是Pythonista」",'''
這是一個專註Python的星球,我們提供「從零單排」、「實戰項目」、「大航海」、「技術沙龍」、「技術分享」、「大廠內推」等系列供你選擇及學習,當然也會有周邊技術沿伸。
本星球會不定期開展各類實戰項目,階段性組織線上技術沙龍、分享等;對於職業發展路線不明確的,我們會邀請到一些大廠hr及高級開發、經理等給大家解惑。
加入我們,和千人一起玩Python,To be a Pythonista!
''')
# 創建一個MainUI對象
app = MainUI()
# 設置視窗標題
app.master.title('「人人都是Pythonista」')
# 設置窗體大小
app.master.geometry('400x100')
# 主迴圈開始
app.mainloop()
在這裡:
- 我們導入了 tkinter 的相關模塊
- 定義了初始化函數,通過 grid() 方法將我們的組件傳給父容器
- 自定義一個創建組件的方法,我們創建了一個標簽和一個按鈕,這個按鈕被點擊後就會觸發 answer這個方法
- 我們通過 messagebox 來顯示一個提示框
- 實例化我們的 APP,然後通過主線程來監聽我們的界面操作
運行後如下:
5.總結
想要做出漂亮的UI界面,還是需要深入地學習下Tkinter這個模塊。上文中的我們只用到了框架、按鈕、標簽、文本這四種控制項,而在Tkinter中給我們提供了15種控制項供大家使用。
此外Tkinter控制項佈局有三種方式:包裝pack()、網格grid()、位置place(),本文中選用了grid,大家也可以逐一嘗試下有什麼區別,期待大家的大試牛刀~
關註公眾號「Python專欄」,後臺回覆關鍵字:zsxq03,獲取本文全部代碼