Skip to content
Related Articles

Related Articles

Tkinter – Button that changes its properties on hover
  • Last Updated : 08 Dec, 2020

Python offers multiple options for developing GUI (Graphical User Interface). Out of all the GUI methods, tkinter is the most commonly used method. It is a standard Python interface to the Tk GUI toolkit shipped with Python. Python with tkinter is the fastest and easiest way to create GUI applications. Creating a GUI using tkinter is an easy task.

In this article, we are going to create a button that changes its properties on hover.

Step-by-step Approach:

  • Import tkinter module.

Python3

filter_none

edit
close

play_arrow

link
brightness_4
code

# import required module
from tkinter import *

chevron_right


  • Creating A Universal Function To Give Change On Hover Power To Every Button.

The config() method is used to change the properties of any widget. Note that in config() method bg and background are two different options and background represents background-color.



Syntax:

widget.config(**options)

Below is the implementation:

Python3

filter_none

edit
close

play_arrow

link
brightness_4
code

# function to change properties of button on hover
def changeOnHover(button, colorOnHover, colorOnLeave):
  
    # adjusting backgroung of the widget
    # background on entering widget
    button.bind("<Enter>", func=lambda e: button.config(
        background=colorOnHover))
  
    # background color on leving widget
    button.bind("<Leave>", func=lambda e: button.config(
        background=colorOnLeave))

chevron_right


  • Create a button in driver code and call the explicit function.

Python3

filter_none

edit
close

play_arrow

link
brightness_4
code

# Driver Code
root = Tk()
  
# create button
# assign button text along
# with background color
myButton = Button(root,
                  text="On Hover - Background Change",
                  bg="yellow")
myButton.pack()
  
# call function with background
# colors as argument
changeOnHover(myButton, "red", "yellow")
  
root.mainloop()

chevron_right


Below is the complete program based on the above approach:

Python3

filter_none

edit
close

play_arrow

link
brightness_4
code

# import required module
from tkinter import *
  
  
# function to change properties of button on hover
def changeOnHover(button, colorOnHover, colorOnLeave):
  
    # adjusting backgroung of the widget
    # background on entering widget
    button.bind("<Enter>", func=lambda e: button.config(
        background=colorOnHover))
  
    # background color on leving widget
    button.bind("<Leave>", func=lambda e: button.config(
        background=colorOnLeave))
  
  
# Driver Code
root = Tk()
  
# create button
# assign button text along
# with background color
myButton = Button(root,
                  text="On Hover - Background Change",
                  bg="yellow")
myButton.pack()
  
# call function with background
# colors as argument
changeOnHover(myButton, "red", "yellow")
  
root.mainloop()

chevron_right


Output:

Attention geek! Strengthen your foundations with the Python Programming Foundation Course and learn the basics.

To begin with, your interview preparations Enhance your Data Structures concepts with the Python DS Course.

My Personal Notes arrow_drop_up
Recommended Articles
Page :