tkinter-button詳解

本文介紹tkinter的button控件。通常按鈕的作用就是用來點擊,然後完成相應的動作。那麼怎樣表示按鈕的作用以及對應的動作呢?本文將詳細介紹。

按鈕(button)

在tkinter中,button的定義如下:

Button(master=None, cnf={}, **kw)

按鈕的屬性

text

指定按鈕上的文字

from tkinter import Tk,Button

main_win = Tk()
main_win.title('漁道的按鈕')
width = 450 
height = 450 
main_win.geometry(f'{width}x{height}')

text = "點我"
Button(main_win, text=text).pack()

main_win.mainloop()

button_text

font

指定按鈕上文字的字體

text = "點我"
font=("Courier", 20, "bold")
Button(main_win, text=text, font=font).pack()

button_font

width

指定按鈕的寬度。如果按鈕上顯示的是文字,則以字符個數爲寬度單位;如果按鈕上顯示的是圖片,則以像素爲寬度單位

height

指定按鈕的高度。如果按鈕上顯示的是文字,則以字符個數爲高度單位;如果按鈕上顯示的是圖片,則以像素爲高度單位

text = "點我"
Button(main_win, text=text, width=20, height=10).pack()

button_width_height

anchor

錨點,用來指定文本或圖像在label顯示區的顯示位置。默認值是"center",可設置的值爲’n’, ‘ne’, ‘e’, ‘se’, ‘s’, ‘sw’, ‘w’, ‘nw’; ‘e’、‘w’、‘s’、'n’分別表示東西南北。

# 這裏我們將按鈕的寬和高設置爲40和10,anchor爲'se'
# 最終的顯示效果是 '點我'在按鈕的東南方,也就是右下角;
Button(main_win, anchor='se', width=40, height=10, bg='white', text='點我').pack()

button_anchor

image

指定在按鈕上顯示的圖片

png = PhotoImage(file='qq.png')
Button(main_win, image=png).pack()

注意,生成的是一個帶圖片的按鈕。

button_image

如果,text和image屬性都指定了,將會顯示什麼呢?按鈕將會僅顯示圖片

png = PhotoImage(file='qq.png')
text = 'hello'
Button(main_win, image=png, text=text, fg='red').pack()

compound

使按鈕中 文字和圖片都可以顯示. text和image的位置是相對於image的.例如,compound爲bottom,就是text在上,image在下.

main_win.geometry(f'{800}x{800}')
png = PhotoImage(file='button.png')
text = '漁道的按鈕'
fg='blue'
Button(main_win, compound='bottom', image=png, text=text, fg=fg).pack()
Button(main_win, compound='top', image=png, text=text, fg=fg).pack()
Button(main_win, compound='center', image=png, text=text, fg=fg).pack()
Button(main_win, compound='left', image=png, text=text, fg=fg).pack()
Button(main_win, compound='right', image=png, text=text, fg=fg).pack()

button_text_image

bitmap

bitmap屬性也是用來顯示圖片。但是有點兒特殊,它是用來顯示位圖。它有兩種顯示來源。一種是tkinter內置的位圖;一種是用戶指定圖片。

# 顯示tkinter內置的位圖
bitmap_list = ['error', 'hourglass', 'questhead', 'info',
                'question', 'warning', 'gray12', 'gray50', 
                'gray75']
for bitmap in bitmap_list:
    Button(main_win, bitmap=bitmap).pack()

button_bitmap_internel

bitmap屬性的值是字符串,字符串值只有兩種,一種就是前面使用的內置位圖的字符串,另一種是使用 @+xbm後綴的文件名。

重點:僅支持xbm格式且xbm的路徑要使用@開頭

from PIL import Image
xbm = 'qq.xbm'
# 將qq.png轉換位單通道的qq.xbm圖片
Image.open('qq.png').convert("1").save(xbm)
Button(main_win, bitmap='@'+xbm).pack()

button_bitmap_externel

backgroud\bg

指定按鈕背景顏色

foreground\fg

指定按鈕前景顏色,即文字的顏色

text = "點我"
Button(main_win, fg='white', bg='black', text=text).pack()

button_fg_bg

cursor

指定鼠標在按鈕上時的顯示樣式,樣式的值是’arrow’, ‘watch’, ‘cross’

Button(main_win, cursor="cross", width=40, height=10, text='點我', anchor='ne').pack()

由於不能將鼠標截圖,這裏就不展示了,可自行運行程序觀察。

borderwidth\bd

指定按鈕邊框寬度

padx

指定水平方向上按鈕內容和邊框的間距

pady

指定垂直方向上按鈕內容和邊框的間距

main_win.geometry(f'{800}x{800}')
fg = 'white'
bg = 'black'
text = '點我'
w = 20
h = 10
Button(main_win, text=text, fg=fg, background=bg).pack()
Button(main_win, text=text, fg=fg, background=bg,
                width=w, height=h).pack()
# borderwidth
Button(main_win, text=text, fg=fg, background=bg,
                width=w, height=h, borderwidth=10).pack()
# padx pady
Button(main_win, text=text, fg=fg, background=bg,
                width=w, height=h, borderwidth=10,
                padx = 10, pady = 10).pack()

main_win.mainloop()

button_padx_pady_bd

上面例子的顯示結果可以看出,如果設置bd、padx、pady,按鈕會相應變大.

relief

指定邊框樣式,默認樣式爲’flat’,樣式的種類有:‘flat’, ‘groove’, ‘raised’, ‘ridge’, ‘solid’, ‘sunken’

如果bd的寬度變大,relief顯示的邊框也會跟着變大。

main_win.geometry(f'{600}x{800}')
relief_list = ['flat', 'groove', 'raised', 'ridge', 'solid', 'sunken']

for relief in relief_list:
    Button(main_win, text="點我", fg='red', background="green",
                width = 10, height=5, borderwidth=10, 
                padx=10, pady=10, relief=relief).pack()

button_relief

overrelief

當鼠標飄過按鈕時,按鈕的邊框的顯示樣式

text='點我'
Button(main_win, text=text, bg='red', bd=5, width=10, height=10, overrelief='groove').pack()

justify

定義按鈕中文字的對齊方式,"left"左對齊,"center"居中,"right"右對齊

poem = '''
            將進酒
             李白
君不見黃河之水天上來,奔流到海不復回。
君不見高堂明鏡悲白髮,朝如青絲暮成雪。
人生得意須盡歡,莫使金樽空對月。
天生我材必有用,千金散盡還復來。
烹羊宰牛且爲樂,會須一飲三百杯。
岑夫子,丹丘生,將進酒,杯莫停。
與君歌一曲,請君爲我傾耳聽。
鐘鼓饌玉不足貴,但願長醉不願醒。
古來聖賢皆寂寞,惟有飲者留其名。
陳王昔時宴平樂,斗酒十千恣歡謔。
主人何爲言少錢,徑須沽取對君酌。
五花馬、千金裘,呼兒將出換美酒,與爾同銷萬古愁。
'''
main_win.geometry(f'{800}x{800}')
Button(main_win, text=poem, fg='white', justify="center", background="blue",
            borderwidth=10, 
            padx=10, pady=10, relief='ridge').pack()

Button(main_win, text=poem, fg='white', justify="left", background="blue",
            borderwidth=10, 
            padx=10, pady=10, relief='ridge').pack()

button_justify

state

指定button的狀態,normal(默認)/active/disable

activebackground

指定button爲active狀態時的背景顏色

activeforeground

指定button爲active狀態時的前景顏色

Button(main_win, text='點我', bg='white', state='active', 
            activeforeground='red', activebackground='green').pack()

Button(main_win, text='點我', bg='white', state='normal', 
            activeforeground='red', activebackground='green').pack()

button_acfg_acbg

disabledforeground

當button的狀態爲DISABLE時,文字的顯示顏色

Button(main_win, text='點我', bg='white', state='disable', 
            disabledforeground='red', activebackground='green').pack()

Button(main_win, text='點我', bg='white', state='normal', 
            activeforeground='red', activebackground='green').pack()

button_disabledfg

command

指定按鈕被點擊時調用的函數。按鈕非常重要的屬性,提升人機交互體驗。

def click_cb():
    messagebox.showinfo("title", "我是漁道")
Button(main_win, command=click_cb, text='點我', bg='white').pack()

鼠標點擊 "點我"按鈕後,會彈出一個對話框,如下圖所示:

button_command

textvariable

顯示 StringVar變量的內容,作用是可以動態的更新label顯示的內容。

def click_cb(text_var):
    text_var.set("好壞哦")

text_var = StringVar() 
text_var.set("點我")

Button(main_win, command=lambda : click_cb(text_var), bg='white', textvariable=text_var).pack()

button_textvariable

當點擊"點我"按鈕後,按鈕上的文字變成了"好壞哦"。可運行程序感受一下簡單的動態交互效果.

button_textvariable2

repeatdelay

重複延遲

表示點擊按鈕後,延遲repeatdelay(ms),做出相應動作.

def click_cb():
    print("xxx")

text_var = StringVar() 
text_var.set("點我")

# 點擊按鈕,即刻執行click_cb()
# Button(main_win, command=click_cb, bg='white', textvariable=text_var).pack()
Button(main_win, repeatdelay=1000, command=click_cb, bg='white', textvariable=text_var).pack()
# 點擊按鈕,延遲1秒 執行click_cb()

repeatinterval

重複間隔

repeatinterval需要和repeatdelay一起使用才能湊效.作用就是長按按鈕時,間隔repeatinterval(ms),執行相應動作.

def click_cb():
    print("xxx")

text_var = StringVar() 
text_var.set("點我")

# 長按按鈕,間隔300ms,執行一次click_cb()
Button(main_win, repeatdelay=1000, repeatinterval=300, command=click_cb, bg='white', textvariable=text_var).pack()

button的屬性就先介紹到這裏,如果以後有新的發現,繼續追加!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章