TkinterのButtonの使い方[全てのオプションとメソッドを解説]

TkinterのButtonの使い方[全てのオプションとメソッドを解説]

GUI(Graphical User Interface)アプリケーションの開発において、ユーザーフレンドリーで効果的なインターフェースを構築するために、Tkinterライブラリを活用することは非常に重要です。TkinterはPythonの標準GUIライブラリであり、多くのPython開発者にとって最初の選択肢です。そして、その中でもボタンは、ユーザーとの対話を実現するために不可欠な要素です。

しかし、Tkinterボタンの使い方やカスタマイズについての情報は、初学者から経験豊富な開発者まで、幅広いスキルレベルのプログラマーにとって、しばしば混乱のもととなります。そこで、このブログではTkinterボタンに焦点を当て、その基本から高度なテクニックまでを網羅的に取り上げます。

Tkinterボタンの正しい使い方やデザイン、イベントハンドリング、フォーカスの制御、そしてユーザー体験の向上に向けたヒントとコツを提供します。また、特定の文字に下線を引いたり、フォーカスの振る舞いを調整したりする方法についても詳しく説明します。

このブログでは、Tkinterボタンを使ったGUIアプリケーションの開発において、成功への道を拓くための情報を提供します。さあ、一緒にTkinterボタンの世界へ深く探検し、優れたユーザーエクスペリエンスを実現しましょう。

Buttonのオプション

Buttonで使えるスタンダートオプションは以下の通りです。(ABC順)

activebackground, activeforeground, anchor,background, bitmap, borderwidth, cursor,disabledforeground, font, foreground,highlightbackground, highlightcolor,highlightthickness, image, justify,padx, pady, relief, repeatdelay,repeatinterval, takefocus, text,textvariable, underline, wraplength

Buttonで使える固有オプションは以下の通りです。(ABC順)

command, compound, default, height,overrelief, state, width

Buttonの固有メソッド

Buttonは固有メソッドとしてflashとinvokeを持っています。

Buttonの作成

クリックすると「クリックしました」と出力するシンプルなボタンを作成して配置するコード例です。

例1:オブジェクト指向型

import tkinter as tk

class MyApplication:
    def __init__(self, root):
        self.root = root
        self.create_widgets()

    def create_widgets(self):
        self.button_a = tk.Button(self.root, text="ボタン", command=self.button_click)
        self.button_a.pack()

    def button_click(self):
        print("クリックしました")

if __name__ == "__main__":
    root = tk.Tk()
    app = MyApplication(root)
    root.mainloop()

例2:手続き型

import tkinter as tk

def button_click():
    print("クリックしました")

root = tk.Tk()

button_a = tk.Button(root, text="ボタン", command=button_click)
button_a.pack()

root.mainloop()

オプションの設定方法

Tkinterでオプションを設定する方法は下記の3パターンが用意されています。

パターン1:引数にキーワード指定する

button_a = tk.Button(root, text="ボタン", foreground="red")

パターン2:オプションを辞書インデックスとして指定

button_a = tk.Button(root, text="ボタン")
button_a["foreground"] = "red"

パターン3:config()メソッドを使用する(configure()でも可)

button_a = tk.Button(root, text="ボタン")
button_a.config(foreground="red")

config()メソッドは主にオプションを後から変更したい時に使用されます。

import tkinter as tk
# クリックすると文字が青くなる関数
def button_click():
    button_a.config(foreground="blue")

root = tk.Tk()
# 赤い文字のボタンを作成
button_a = tk.Button(root, text="ボタン", foreground="red", command=button_click)
button_a.pack()

root.mainloop()

また、オプションの元の値を取得する時にはcget()メソッドが使えます。
下記のコードはクリックする度にボタンが縦に伸びていくサンプルコードです。

import tkinter as tk
# クリックすると高を倍にする
def button_click():
    height = button_a.cget("height")
    button_a.config(height=height*2)

root = tk.Tk()
# 高さが2のボタンを作成
button_a = tk.Button(root, text="ボタン", height=2, command=button_click)
button_a.pack()

root.mainloop()

クリック前

3回クリック後

オプション固有のデフォルトの値を変更する

各オプションには予めデフォルトの値が割り振られています。
option_add()メソッドを使用する事でデフォルトの値を変更できます。
下記コードはボタンの背景色を変更するサンプルコードです。

import tkinter as tk

root = tk.Tk()
root.option_add('*Button.background', '#afafb0')

button_a = tk.Button(root, text="ボタン",)
button_a.pack()

root.mainloop()

Buttonの各オプションの詳細

Bunttonクラスの各オプションをコードを用いて解説していきます。
なお、個人的に優先度の高いオプションから紹介しています。

主要オプション

command

commandはButtonクラスで最も重要なオプションです。
commandは押したときに実行される関数を指定する事が出来ます。

import tkinter as tk

def button_click():
    print("クリックしました")

root = tk.Tk()

button_a = tk.Button(root, text="ボタン", command=button_click)
button_a.pack()

root.mainloop()

上記のコードではcommand=button_clickと書かれています。
これでbutton_aがクリックされた時にbutton_click関数が実行されます。

commandで関数を指定する際には()を付けない点に注意して下さい。
()を付けるとスクリプト実行時に関数が実行されてしまうので、ボタンを押しても何も反応しません。

引数を渡したい場合はlambda式を使用すると簡単に記述する事が出来ます。

import tkinter as tk

def button_click(kw):
    print(f"{kw}")

root = tk.Tk()

button_a = tk.Button(root, text="ボタン", command=lambda : button_click("テスト"))
button_a.pack()

root.mainloop()

上記のサンプルコードでボタンをクリックすると引数として渡した「テスト」の文字列が出力されます。

text

textはボタンに表示させる文字を指定するオプションです。
複数行のボタンを作成する方法は三連引用符を用いるか改行コードを使用します。

例1:三連引用符

import tkinter as tk

root = tk.Tk()

button_a = tk.Button(
 root,
 text="""1行目
 2行目"""
 )
button_a.pack()

root.mainloop()

例2:改行コード

import tkinter as tk

root = tk.Tk()

button_a = tk.Button(root, text="1行目\n2行目")
button_a.pack()

root.mainloop()

textvariable

textvariableはテキストに表示する文字を指定するオプションです。
textvariableはテキスト用のヴィジェット変数となっており、textオプションより優先されます。

各ヴィジェット変数(VariableBooleanVarDoubleVarIntVarStringVar)をインスタンス化した後set()メソッドを使ってオブジェクトにテキストをセットする事が出来ます。

import tkinter as tk

def button_click():
    button_text.set("クリックされました")

root = tk.Tk()

button_text = tk.StringVar(root)
button_text.set("クリックして下さい")
button_a = tk.Button(root, textvariable=button_text, command=button_click)
button_a.pack()

root.mainloop()

font

fontの設定方法はコチラの記事でまとめておりますので、コチラを参考にして下さい。

Tkinter fontの設定方法

画像関係

コチラのサイトから画像をお借りしています。

→http://sozai.akuseru-design.com/category/sozai/button/

使用画像

image

ボタンに画像を指定する際はimageオプションを使用します。

imageオプションを使用する為にはtkinterのPhotoImageクラスを使って画像をインスタンス変数に代入する必要があります。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

img = tk.PhotoImage(file=r"C:tkinter\img\btn.png")

button = tk.Button(root, image=img)

button.pack()

root.mainloop()

bitmap

あまり使われることはありませんがbitmapも扱うことが出来ます。
bitmapを使うと組み込み画像を使用できます。

左から'error''gray75''gray50''gray25''gray12''hourglass''info''questhead''question', 'warning'

サンプルスクリプト

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, bitmap='warning')
button.pack()

root.mainloop()

compound

compoundを使うとtextと画像を組み合わせてボタンを作ることが出来ます。

これはテキストをcenter(中央)に配置した例です。サンプルコード

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

img = tk.PhotoImage(file=r"C:teitter_tkinter\img\btn.png")

button = tk.Button(root, text="ボタン", image=img, compound="center")

button.pack()

root.mainloop()

また、各値は画像を元に命名付けされています。

top画像をテキストの上に配置
bottom画像をテキストの下に配置
right画像をテキストの右に配置
left画像をテキストの左に配置
center画像とテキストを中央に配置
テキストが画像の上に表示される
none画像のみ表示(デフォルト値)

サイズ

height

ボタンの高さを指定するオプションです。
テキストのみのボタンの時は文字数を元に指定します。
つまりhright=10とすると10文字分の高さを持ったボタンが作成されます。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", height=10)

button.pack()

root.mainloop()

ボタンに画像が使用されている場合、pxを指定できます。

width

ボタンの幅を指定します。使い方はheightと同様です。

anchor

ボタンの中にテキストを配置する位置を東西南北で指定できます。

‘nw’‘n’‘ne’
‘w’‘center’‘e’
‘sw’‘s’‘se’

何も指定しない場合デフォルトになります。

北西(nw)に配置するサンプルコード

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", height=5, width=10, anchor="nw")

button.pack()

root.mainloop()

justify

複数行テキストの揃え方を指定します。
値はleft,center,rightでデフォルトはcenterです。

右側で揃えるサンプルコード

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="あああああ\nいいいい\nううう", height=5, width=10, justify="right")

button.pack()

root.mainloop()

padx

x方向に内部間隔を作ります。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", padx=100)

button.pack()

root.mainloop()

pady

y方向に内部間隔を作ります。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", pady=30)

button.pack()

root.mainloop()

wraplength

テキストを折り返すまでの幅をスクリーン座標単位で指定します。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", wraplength=10)

button.pack()

root.mainloop()

色関係

background (bg)

背景色を指定します。backgroundはbgと略する事ができます。
色の指定方法はRGBでも指定できますが、Tkinterでは様々な色を色名で用意されていますので、そちらで指定する事もできます。

色名はコチラを参照にして下さい。

https://www.tcl.tk/man/tcl8.6/TkCmd/colors.html

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", background='brown')

button.pack()

root.mainloop()

foreground (fg)

テキストの色を指定しますforegroundはfgと表記する事ができます。

色の指定方法はbackgroundと同じです。

activebackground

ボタンがアクティブ状態の時の背景色を指定します。

以下はクリック時に背景の色が変わるサンプルコードです。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", activebackground='brown')

button.pack()

root.mainloop()

activeforeground

ボタンがアクティブ状態の時のテキストの色を指定できます。

disabledforeground

ボタンが無効状態の時のテキストの色を指定できます。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", state="disabled", disabledforeground='brown')

button.pack()

root.mainloop()
この状態ではクリックできません。

外枠

borderwidth(bd)

境界線の幅を指定します。

borderwidthはbdと略する事ができます。

import tkinter as tk

root = tk.Tk()
root.geometry("500x300")

button = tk.Button(root, text="ボタン", borderwidth=10)

button.pack()

root.mainloop()

カーソル

Tkinterで使用できるマウスカーソルの種類はコチラのサイトで調べてください。

Tcl8.6/Tk8.6 – Tk Commands – cursors

以下は、Tkinterを使用してボタンとカーソルを設定するサンプルコードです。この例では、マウスポインタがボタンの上に移動するとカーソルの形状が変わるように設定します。

import tkinter as tk

def change_cursor(event):
    # マウスポインタがボタンの上に入るとカーソルの形状を変更する
    button.config(cursor='hand2')

def restore_cursor(event):
    # マウスポインタがボタンの上から出るとカーソルの形状を元に戻す
    button.config(cursor='')

# Tkinterウィンドウを作成
root = tk.Tk()
root.title("カーソルのサンプル")

# ボタンを作成
button = tk.Button(root, text="カーソルを変更するボタン")
button.pack(padx=20, pady=20)

# ボタンにマウスポインタのイベントをバインド
button.bind("<Enter>", change_cursor)
button.bind("<Leave>", restore_cursor)

# Tkinterメインループを開始
root.mainloop()

このコードでは、tk.Buttonを使用してボタンを作成し、マウスポインタがボタンの上に入ると<Enter>イベントがトリガーされ、change_cursor関数が呼び出されてカーソルの形状が変更されます。また、マウスポインタがボタンの上から出ると<Leave>イベントがトリガーされ、restore_cursor関数が呼び出されてカーソルの形状が元に戻ります。

ボタンの上でマウスを移動させてカーソルの形状が変化することを確認できるはずです。

形状

relief

Tkinterを使用してボタンとreliefオプションを設定するサンプルコードを以下に示します。reliefオプションは、ボタンの立体的な外観を制御します。以下の例では、ボタンのreliefを変更して異なる立体的な効果を示しています。

import tkinter as tk

def set_relief_flat():
    button.config(relief=tk.FLAT)

def set_relief_raised():
    button.config(relief=tk.RAISED)

def set_relief_sunken():
    button.config(relief=tk.SUNKEN)

def set_relief_groove():
    button.config(relief=tk.GROOVE)

def set_relief_ridge():
    button.config(relief=tk.RIDGE)

# Tkinterウィンドウを作成
root = tk.Tk()
root.title("reliefオプションのサンプル")

# ボタンを作成
button = tk.Button(root, text="ボタン", width=20, height=2)
button.pack(pady=20)

# ボタンを変更するためのボタンを作成
flat_button = tk.Button(root, text="FLAT", command=set_relief_flat)
flat_button.pack(side=tk.LEFT, padx=10)

raised_button = tk.Button(root, text="RAISED", command=set_relief_raised)
raised_button.pack(side=tk.LEFT, padx=10)

sunken_button = tk.Button(root, text="SUNKEN", command=set_relief_sunken)
sunken_button.pack(side=tk.LEFT, padx=10)

groove_button = tk.Button(root, text="GROOVE", command=set_relief_groove)
groove_button.pack(side=tk.LEFT, padx=10)

ridge_button = tk.Button(root, text="RIDGE", command=set_relief_ridge)
ridge_button.pack(side=tk.LEFT, padx=10)

# Tkinterメインループを開始
root.mainloop()

このコードでは、ボタンを作成し、その下に異なるreliefオプションを設定するためのボタンを配置しています。ボタンをクリックすると、ボタンの外観が異なる立体的な効果に変更されます。

フォーカス

フォーカスはTabキー等のフォーカス移動を指します。

takefocus

takefocusオプションをTrueFalseの両方の設定で持つボタンを追加したサンプルコードを以下に示します。一つはtakefocus=Trueでフォーカスを受け取り、もう一つはtakefocus=Falseでフォーカスを受け取らないボタンです。

import tkinter as tk

def on_button_click_takefocus_true():
    label.config(text="Takefocus=Trueのボタンがクリックされました")

def on_button_click_takefocus_false():
    label.config(text="Takefocus=Falseのボタンがクリックされました")

# Tkinterウィンドウを作成
root = tk.Tk()
root.title("takefocusオプションのサンプル")

# ラベル
label = tk.Label(root, text="ボタンをクリックしてください")
label.pack(pady=20)

# Takefocus=Trueのボタンを作成
button_takefocus_true = tk.Button(root, text="Takefocus=Trueのボタン", command=on_button_click_takefocus_true, takefocus=True)
button_takefocus_true.pack(padx=20, pady=10)

# Takefocus=Falseのボタンを作成
button_takefocus_false = tk.Button(root, text="Takefocus=Falseのボタン", command=on_button_click_takefocus_false, takefocus=False)
button_takefocus_false.pack(padx=20, pady=10)

# 別のウィジェット(エントリ)をフォーカスできるように設定
entry = tk.Entry(root)
entry.pack(padx=20, pady=10)

# Tkinterメインループを開始
root.mainloop()

このコードでは、takefocus=Truetakefocus=Falseの2つのボタンを作成し、それぞれのボタンがクリックされたときに異なるメッセージを表示します。一方のボタンはフォーカスを受け取り、もう一方のボタンはフォーカスを受け取らないことが確認できます。

まとめ

Tkinterを使用してボタンを操作する方法について詳しく見てきました。ボタンはGUIアプリケーションの重要な要素であり、ユーザーインターフェースを構築する上で欠かせないものです。我々はボタンの作成、テキストのカスタマイズ、クリックイベントの処理、外観のカスタマイズ、フォーカスの制御など、ボタンに関するさまざまな側面を学びました。

Tkinterのボタンを使いこなすことで、ユーザーフレンドリーなアプリケーションを設計し、効果的なインタラクションを提供することができます。Tkinterを使ったアプリケーション開発のスキルは、Pythonプログラマーにとって非常に価値のあるものです。ぜひこの知識を活用して、魅力的なGUIアプリケーションを作成してみてください。

お読みいただき、ありがとうございました。Tkinterを使ったボタンの操作に関する情報がお役に立てれば幸いです。今後のプログラミングプロジェクトで、Tkinterのボタンを上手に活用してください。成功をお祈りしています。

 data-src=

プログラミング情報サイト「In-Output」

当サイトではプログラミング言語の情報を発信しています。
HTMLやCSSのマークアップ言語の学習方法や解説、WordPressでのサイト開設方法、python等のプログラミング言語を使用して日頃の作業の効率化等、皆様のお役に立てるサイトを目指しています。

CTR IMG