tkinter學習系列(四)之Button 控制元件

夢並不遙遠發表於2019-02-03

目錄

前言

Button小部件是一個標準的Tkinter的控制元件,用於實現各種按鈕。按鈕可以包含文字或影像,您可以呼叫Python函式或方法用於每個按鈕。Tkinter的按鈕被按下時,會自動呼叫該函式或方法

(一)基本用法和可選屬性

==1.基本用法==

基本用法:Button(根物件, [屬性列表])

根物件:在那個窗體顯示,例如主窗體。

屬性列表:是可選的屬性=屬性值組成。

==2.可選屬性==

屬性 說明
text 標籤顯示的文字
font 設定文字的字型和大小
fg(foreground) 字型的顏色,
bg (background) 標籤的背景色
width 標籤的寬度(一箇中文的字型寬為單位)
height 標籤的高度(一箇中文的字型高為單位)
cursor 滑鼠的樣式
command 繫結事件
padx 文字到邊框的距離,水平方向
pady 文字到邊框的距離,垂直方向
bd(borderwidth) 邊框的寬度
relief 邊框的樣式
justify 文字對齊方式
image 圖片
compound 圖片與文字的混搭
anchor 方位

(二)屬性的具體實現和案例

==1.常用屬性==

(1)font

font:設定字型與字型的大小

用法:font=(“字型名”,大小) 例如:font=(“黑體”, 20)

(2)fg 與 bg

fg 前景色,也就是字型的顏色,bg 背景顏色

用法:fg=”red”, fg=”#121234″

(3)width 與 height

width height 標籤的寬度與高度,都是以系統預設的中文的一個字型寬高為單位

用法:width = 5, height=2

==案例一==

(1)原始碼

import tkinter as tk

win = tk.Tk()

# 普通的按鈕
button1 = tk.Button(win, text="Button1")
button1.pack()

# 背景色與前景色
button2 = tk.Button(win, text="Button2", bg="green", fg="blue")
button2.pack()

# 寬度與高度
button3 = tk.Button(win, text="Button3", width=10, height=2)
button3.pack()

# 邊距
button4 = tk.Button(win, text="Button4", padx=10, pady=10)
button4.pack()
win.mainloop()

(2)輸出效果

01.png

==2.按鈕裡的圖片==

(1)只放圖片,沒有文字

需要先匯入圖片的路徑:img1 = tk.PhotoImage(file=”image/01.png”)

再使用:image=img1

注:目前支援 .png 與 .gif 格式, 還不支援 .jpg格式,==Button的大小是根據圖片的大小來確定的。==

==案例二==

(1)原始碼:

import tkinter as tk

win = tk.Tk()

img1 = tk.PhotoImage(file="image/01.png")
img2 = tk.PhotoImage(file="image/03.png")
img3 = tk.PhotoImage(file="image/04.png")

# 300畫素大小的圖片
button1 = tk.Button(win, text="Button1", image=img1)
button1.pack()

# 150畫素大小的圖片
button2 = tk.Button(win, image=img2)
button2.pack()

# 50畫素大小的圖片
button3 = tk.Button(win, image=img3)
button3.pack()

win.mainloop()

(2)輸出效果:

02.png

(3)圖片與文字混搭

需要使用:compound=”對齊方式”,

對齊方式有:`left`, “right”, “center”

==案例三==

(1)原始碼

import tkinter as tk

win = tk.Tk()

img1 = tk.PhotoImage(file="image/01.png")
img2 = tk.PhotoImage(file="image/03.png")
img3 = tk.PhotoImage(file="image/04.png")


button1 = tk.Button(win, text="Button1", image=img1, compound="left")
button1.pack()

button2 = tk.Button(win, text="Button2", image=img2, compound="center")
button2.pack()

button3 = tk.Button(win, text="Button3", image=img3, compound="right")
button3.pack()

win.mainloop()

(2)輸出效果

03.png

==3.滑鼠的樣式==

cursor=”滑鼠的屬性值”

pencil:筆型

circle:圓形

hand1:手型1

hand2:手型2

==案例四==

(1)原始碼

import tkinter as tk

win = tk.Tk()

# 筆型
button1 = tk.Button(win, text="Button1", cursor="pencil")
button1.pack()

# 圓形
button2 = tk.Button(win, text="Button2", cursor="circle")
button2.pack()

# 手型1
button3 = tk.Button(win, text="Button3", cursor="hand1")
button3.pack()

# 手型2
button4 = tk.Button(win, text="Button4", cursor="hand2")
button4.pack()

win.mainloop()

(2)輸出效果

當我們把滑鼠放在按鈕上時,滑鼠的形狀會顯示不同的樣式。

04.png

==4.邊框樣式==

relief= “邊框樣式值”

flat 無邊框

groove 中間凹

ridge 中間凸

raised 往中間凸

solid 往中間凹

sunken 不可以

==案例五==

(1)原始碼

import tkinter as tk

win = tk.Tk()

# flat 無邊框
button1 = tk.Button(win, text="flat", relief="flat", bd=10)
button1.pack()

# groove 中間凹
button2 = tk.Button(win, text="groove", relief="groove", bd=10)
button2.pack()

# ridge 中間凸
button3 = tk.Button(win, text="raised", relief="ridge", bd=10)
button3.pack()

# raised 往中間凸
button4 = tk.Button(win, text="ridge", relief="raised", bd=10)
button4.pack()

# solid 往中間凹
button5 = tk.Button(win, text="solid", relief="solid", bd=10)
button5.pack()

# sunken 不可以
button6 = tk.Button(win, text="sunken", relief="sunken", bd=10)
button6.pack()

win.mainloop()

(2)輸出效果

05.png

(三)按鈕的事件繫結

==1.普通的Button繫結事件==

(1)說明:

Button 使用 command=功能函式 來繫結

Button(win, text=”確定”, command=功能函式)

==案例六==

(1)原始碼:

我們建立一個簡單的窗體,只有一個按鈕控制元件,

我們繫結的事件是,當我們點選”確定”按鈕時,會輸出“你點選了按鈕”

import tkinter as tk
win = tk.Tk()

# 定義功能函式, event是必須新增的引數,不知道來自哪裡
def button_command():
    print("你點選了按鈕")
# 繫結事件
btn = tk.Button(win, text="確定", command=button_command)

btn.place(relx=0.2, rely=0.2, relwidth=0.5, relheight=0.1)
win.geometry("300x300+200+200")
win.mainloop()

(2)輸出效果:

06.png

==2.傳引數Button繫結事件==

(1)說明:

我們使用Button傳遞數值時,需要用:

lambda: 功能函式(var1, var2, ……)

==案例七==

(1)原始碼:

我們同樣建立一個簡單的窗體,只有一個控制元件按鈕

我們繫結的事件是,當我們點選按鈕時,會傳入兩個引數,並在功能函式進行計算。

import tkinter as tk
"""
    Button command 傳值事件
    command= lambda: function(var1, var2, ...)
"""


def sum_fun(a, b):
    result = a + b
    print("%d + %d = %d" % (a, b, result))


win = tk.Tk()
button = tk.Button(win, text="傳值事件", command=lambda: sum_fun(12, 13))
button.pack()
win.geometry("300x300+200+200")
win.mainloop()

(2)輸出效果:

07.png

作者:Mark

日期:2019/02/01 週五

相關文章