Question

将鼠标悬停在按钮上时如何更改图像？我需要当您将鼠标悬停在按钮 1 或 2 上时图片会发生变化：

Photo1 = (file='Image\ProgrammingButton') 
Photo2 = (file='Image\DesignButton')  
But1 = (root, image=Photo1) 
But2 = (root, image=Photo2)

悬停时

Photo1 = (file='Image\ActiveProgrammingButton') 
Photo2 = (file='Image\ActiveDesignButton')

Answer 1

Tkinter 有 'enter' 和 'leave' 事件，您必须将它们绑定到某个函数，并且您可以使用 config 方法更改图像。

这是一个演示：


from tkinter import *
from PIL import Image, ImageTk

def onEnter(event):
    global img
    img = ImageTk.PhotoImage(Image.open(r'img2'))
    btn.config(image=img)

def onLeave(event):
    global img
    img = ImageTk.PhotoImage(Image.open(r'img1'))
    btn.config(image=img)
    

root = Tk()
img = ImageTk.PhotoImage(Image.open(r'img1')) 

btn = Button(root, image=img)
btn.pack()

btn.bind('<Enter>',  onEnter)
btn.bind('<Leave>',  onLeave)

root.mainloop()

如果您希望对许多按钮都有这种效果。我建议您创建自己的按钮来继承 Button 类。

这是一个例子。

感谢@furas 的建议。这是更新的课程

class Btn(Button):

    def __init__(self, root, img1, img2, *args, **kwargs):       
        super().__init__(root, *args, **kwargs)

        self.img = ImageTk.PhotoImage(Image.open(img1))
        self.img2 = ImageTk.PhotoImage(Image.open(img2))

        self['image'] = self.img
        
        self.bind('<Enter>', self.enter)
        self.bind('<Leave>', self.leave)
        
    def enter(self, event):
        self.config(image=self.img2)

    def leave(self, event):
        btn.config(image=self.img)

使用方法：只需在 img1 和 img2 参数中指定您的图片路径

这是一个例子：

img = r'path1' 
img2 = r'path2'

btn = Btn(root, img1=img, img2=img2)
btn.pack()

将鼠标悬停在按钮图像上时更改按钮图像 tkinter

1 个答案: