如何在CustomTkinter中实现按钮模糊效果？

要在CustomTkinter中实现类似示例的模糊按钮，核心思路是通过背景模糊+透明按钮样式结合实现，以下是两种实用方案：

依赖准备 #

先确保安装必要库：

pip install customtkinter pillow

方案一：静态模糊背景按钮（适合固定背景场景） #

如果按钮所在窗口背景固定，可预先生成模糊背景图，再将按钮设置为透明样式叠加在上面：

import customtkinter as ctk
from PIL import Image, ImageFilter

# 初始化CustomTkinter
ctk.set_appearance_mode("dark")
ctk.set_default_color_theme("blue")

root = ctk.CTk()
root.geometry("400x300")
root.title("模糊按钮示例")

# 生成模糊背景图（这里用纯色背景模拟，实际可替换为窗口背景截图）
bg_image = Image.new("RGB", (400, 300), (30, 30, 30))
blurred_bg = bg_image.filter(ImageFilter.GaussianBlur(radius=10))
# 转换为CustomTkinter可用的图像格式
ctk_blurred_bg = ctk.CTkImage(light_image=blurred_bg, dark_image=blurred_bg, size=(400, 300))

# 创建背景标签
bg_label = ctk.CTkLabel(root, image=ctk_blurred_bg, text="")
bg_label.place(relx=0, rely=0, relwidth=1, relheight=1)

# 自定义模糊按钮
def create_blur_button(parent, text, x, y):
    # 截取按钮区域的模糊背景
    btn_bg = blurred_bg.crop((x, y, x+120, y+40))
    ctk_btn_bg = ctk.CTkImage(light_image=btn_bg, dark_image=btn_bg, size=(120, 40))
    
    # 创建透明按钮，用模糊图作为背景
    btn = ctk.CTkButton(
        parent,
        text=text,
        image=ctk_btn_bg,
        compound="center",
        fg_color="transparent",
        hover_color="#555555",  # hover时的半透明效果
        text_color="white",
        width=120,
        height=40
    )
    btn.place(x=x, y=y)
    return btn

# 创建两个模糊按钮
create_blur_button(root, "按钮1", 140, 100)
create_blur_button(root, "按钮2", 140, 180)

root.mainloop()

方案二：动态模糊按钮（随背景变化更新模糊效果） #

如果窗口背景会动态变化，可通过实时截取按钮区域背景并模糊来实现：

import customtkinter as ctk
from PIL import Image, ImageGrab, ImageFilter

ctk.set_appearance_mode("dark")
ctk.set_default_color_theme("blue")

root = ctk.CTk()
root.geometry("400x300")
root.title("动态模糊按钮")

# 实时更新按钮模糊背景的函数
def update_btn_blur(btn):
    # 获取按钮在屏幕上的坐标
    x = root.winfo_rootx() + btn.winfo_x()
    y = root.winfo_rooty() + btn.winfo_y()
    width = btn.winfo_width()
    height = btn.winfo_height()
    
    # 截取按钮区域的屏幕内容
    screenshot = ImageGrab.grab(bbox=(x, y, x+width, y+height))
    # 应用模糊效果
    blurred_screenshot = screenshot.filter(ImageFilter.GaussianBlur(radius=8))
    # 转换为CTkImage
    ctk_blur_img = ctk.CTkImage(light_image=blurred_screenshot, dark_image=blurred_screenshot, size=(width, height))
    
    # 更新按钮背景
    btn.configure(image=ctk_blur_img)

# 创建基础按钮
blur_btn = ctk.CTkButton(
    root,
    text="动态模糊按钮",
    fg_color="transparent",
    hover_color="#555555",
    text_color="white",
    width=150,
    height=50
)
blur_btn.place(relx=0.5, rely=0.5, anchor="center")

# 绑定窗口配置事件（窗口大小/位置变化时更新）
root.bind("<Configure>", lambda e: update_btn_blur(blur_btn))
# 初始加载时更新一次
update_btn_blur(blur_btn)

root.mainloop()

关键细节说明 #

• 模糊半径(radius)：可根据需求调整数值，数值越大模糊效果越强
• hover_color：设置半透明的hover效果，增强交互感
• 动态方案中ImageGrab在不同系统上的兼容性：Windows/macOS直接可用，Linux需安装scrot工具

内容的提问来源于stack exchange，提问作者Viktor Petrov