【Python tkinter】マウスカーソルのホバー時にラベルやボタンの背景色を変更する

2021.02.14 /

【Python tkinter】マウスカーソルのホバー時にラベルやボタンの背景色を変更する

本記事ではPythonのtkinterによるGUIアプリケーションで、ラベルまたはボタンウィジェットにマウスカーソルがのったとき(ホバー時)にウィジェットの背景色を変更する方法について解説していきます。

ttkのButtonウィジェットであれば、デフォルトでマウスカーソルのホバー時に背景色が変更します。
しかしtkinterのButtonウィジェットでは本記事で紹介する方法を使う必要があります。

Labelウィジェットにおいては、tkinterでもttkにおいてもホバー時の背景色変更は、本記事の方法を使う必要があります。

本記事を通して以下の知識を学べます。

学べる知識
  • ウィジェットのホバー時の背景色変更方法
  • bind()メソッドの使用方法
  • eventオブジェクトからbgの取得・変更方法

サンプルプログラム

以下にラベルウィジェットにマウスカーソルがホバー時(マウスカーソルがのったとき)に背景色が変更されるサンプルプログラムを記します。

# tkinterのインポート
import tkinter as tk

def enter_bg(event):
    event.widget['bg'] = '#CCFFFF'

def leave_bg(event):
    event.widget['bg'] = 'SystemButtonFace'
# rootメインウィンドウの設定
root = tk.Tk()
root.title("tkinter")
root.geometry("300x150")

# メインフレームの作成と設置
frame = tk.Frame(root)
frame.pack(fill = tk.BOTH, padx=5, pady=10)

# 各種ウィジェットの作成
for i in range(1,6):
    label = tk.Label(frame, text=i, width=50)
    label.bind("", enter_bg)
    label.bind("", leave_bg)
    label.pack()

root.mainloop()

このサンプルプログラムを起動すると次の画面が表示されます。

サンプルプログラム

この画面上でマウスカーソルをラベルウィジェットの上にのせると背景色が変更されます。

サンプルプログラム:ホバー時

マウスカーソルをラベルウィジェットから離すと背景色は元に戻ります。

このサンプルプログラムについて以下で解説していきます。

また本サンプルプログラムで使用しているbind()メソッドやeventオブジェクトについての詳しい使い方は、以下記事をご参照ください。

プログラム解説

bind()メソッド

サンプルプログラムではbind()メソッドを使って、ラベルウィジェットに対してイベント(操作)とコールバック関数を紐づけています。

label = tk.Label(frame, text=i, width=50)
label.bind("<Enter>", enter_bg)
label.bind("<Leave>", leave_bg)

上記では、enter_bg関数とleave_bg関数を実行するトリガーとして、マウスカーソルがホバーしたとき、離れたときで紐づけています。

bind()メソッドの第一引数には関数を実行するトリガー(イベント)を指定します。
ここでは”Enter”(マウスカーソルがウィジェット内に入ったとき)と”Leave”(マウスカーソルが離れたとき)で指定しております。

コールバック関数の定義

bind()メソッドで指定したイベントが発生すると、紐づいた関数が呼び出されます。

呼び出された関数にはeventオブジェクトが渡されるので、関数には忘れずにeventオブジェクトを受け取るようにしてください。

サンプルプログラムでは次のように関数を定義しています。

def enter_bg(event):
    event.widget['bg'] = '#CCFFFF'

マウスホバー時に呼び出されるenter_bg関数では、ラベルウィジェットの背景色(bg)を”#CCFFFF”に変更しています。

event.widgetはイベントを発生させたウィジェットを指します。
つまり、event.widget['bg']はマウスカーソルがホバーしているウィジェットの背景色を示しているのです。

ウィジェットのデフォルト背景色

ラベルウィジェットのデフォルト背景色は、SystemButtonFaceで設定できます。

そのためマウスがウィジェットからLeaveしたとき(離れたとき)に呼び出されるleave_bg関数は次のように定義しています。

def leave_bg(event):
    event.widget['bg'] = 'SystemButtonFace'

まとめ

本記事「【Python tkinter】マウスカーソルのホバー時にラベルやボタンの背景色を変更する」はいかがでしたか。

ユーザービリティを向上させるためにも、ウィジェットホバー時の背景色変更は必要な技術です。

よりよいGUIアプリケーションをtkinterで作成するためにも、本記事で紹介したbind()メソッドやeventオブジェクトの使い方をマスターしましょう。