Python Tkinter按钮点击按住时出现白边框如何解决？

问题根源 #

你遇到的白边框是Tkinter按钮默认的激活状态样式——即便设置了bd=0、relief="flat"，按钮按下时仍会触发内置的高亮/边框逻辑；同时你的事件绑定没有阻止Tkinter的默认按钮行为，导致自定义配置被覆盖。

修复方案 #

1. 初始化按钮时指定激活状态背景色 #

直接在创建按钮时设置activebackground，让按下状态的背景色与按钮默认背景色一致，从根源消除白边框：

self.login_button = tk.Button(
    self, 
    image=self.login_image_final, 
    bg="#3de053", 
    bd=0, 
    relief="flat", 
    highlightthickness=0,
    activebackground="#3de053"  # 关键：设置按下时的背景色
)

注册按钮做同样修改：

self.signup_button = tk.Button(
    self, 
    image=self.signup_image_final, 
    bg="#3de053", 
    bd=0, 
    relief="flat", 
    highlightthickness=0,
    activebackground="#3de053"
)

2. 简化事件绑定，阻止默认行为 #

你之前在事件处理里重复pack按钮完全没必要，反而可能导致布局抖动。修改事件函数，末尾返回"break"阻止Tkinter执行默认按钮逻辑：

def on_login_button_press(self, event):
    return "break"

def on_login_button_release(self, event):
    self.master.show_login_screen()
    return "break"

def on_signup_button_press(self, event):
    return "break"

def on_signup_button_release(self, event):
    self.master.show_signup_screen()
    return "break"

3. 完整修改后的代码 #

class WelcomeScreen(tk.Frame):
    def __init__(self, master):
        super().__init__(master, bg="#3de053")
        self.pack()

        self.label_welcome = tk.Label(self, text="Hi, welcome to the BookBuddy!", bg="#3de053", font=("Arial", 14))
        self.label_welcome.pack(pady=20)

        self.tools = Tools()

        self.image = Image.open("Buttons/login.png")
        login_image = self.tools.resize(self.image, 100, 27)
        self.login_image_final = ImageTk.PhotoImage(login_image)
        self.login_button = tk.Button(
            self, 
            image=self.login_image_final, 
            bg="#3de053", 
            bd=0, 
            relief="flat", 
            highlightthickness=0,
            activebackground="#3de053"
        )
        self.login_button.pack(pady=10)

        self.login_button.bind("<Button-1>", self.on_login_button_press)
        self.login_button.bind("<ButtonRelease-1>", self.on_login_button_release)

        self.image = Image.open("Buttons/signup.png")
        signup_image = self.tools.resize(self.image, 100, 30)
        self.signup_image_final = ImageTk.PhotoImage(signup_image)
        self.signup_button = tk.Button(
            self, 
            image=self.signup_image_final, 
            bg="#3de053", 
            bd=0, 
            relief="flat", 
            highlightthickness=0,
            activebackground="#3de053"
        )
        self.signup_button.pack(pady=10)

        self.signup_button.bind("<Button-1>", self.on_signup_button_press)
        self.signup_button.bind("<ButtonRelease-1>", self.on_signup_button_release)

    def on_login_button_press(self, event):
        return "break"

    def on_login_button_release(self, event):
        self.master.show_login_screen()
        return "break"

    def on_signup_button_press(self, event):
        return "break"

    def on_signup_button_release(self, event):
        self.master.show_signup_screen()
        return "break"

额外补充 #

如果仍有问题，可能是系统主题影响，可给按钮添加takefocus=False属性，禁止按钮获取焦点，避免焦点边框：

self.login_button = tk.Button(
    # 其他属性
    takefocus=False
)

内容的提问来源于stack exchange，提问作者Dark 303