Tkinter自定义标题栏按钮添加图片报错求助

嘿，我看到你遇到的问题啦！这个NameError其实是个很常见的小疏忽，咱们一步步来解决它：

1. 核心问题：变量定义顺序颠倒 #

你在创建menu_button的时候引用了menu_image，但menu_image的定义是在按钮之后才写的——Python是从上到下逐行执行的，这时候程序还不知道menu_image是什么，自然就报错了。咱们得先创建图片对象，再用它来创建按钮。

2. PNG图片加载的坑 #

tkinter自带的PhotoImage只支持GIF、PGM、PPM格式，你的menu.png是PNG格式，所以得用PIL的ImageTk来加载，你已经导入了Image，但还需要补充导入ImageTk。

3. 未定义的颜色变量 #

代码里的Col_bg3、Col_fg1这些颜色变量没有定义，要么提前赋值（比如Col_bg3 = "#34495e"），要么直接替换成具体的颜色字符串。

修正后的完整代码 #

import tkinter as tkr
from tkinter import *
from tkinter.ttk import *
from PIL import Image, ImageTk  # 补充导入ImageTk

# 定义颜色变量（示例值，你可以根据自己的需求修改）
Col_bg3 = "#34495e"
Col_fg1 = "#ecf0f1"
Col_bg4 = "#2c3e50"

window = tkr.Tk()
window.geometry("1000x500")
window.overrideredirect(1)

title_bar = tkr.Frame(window, bg=Col_bg3, relief='raised', bd=0)

# 先创建图片对象，再创建按钮
menu_image = ImageTk.PhotoImage(Image.open("images/menu.png"))  # 用PIL加载PNG

# Title Bar Buttons
close_button = tkr.Button(title_bar, text="✕", bd=0, height=3, width=5)
minimise_button = tkr.Button(title_bar, text="-", bd=0, height=3, width=5)
maximise_button = tkr.Button(title_bar, text="min", bd=0, height=3, width=5)
menu_button = tkr.Button(title_bar, image=menu_image, bg=Col_bg3, fg=Col_fg1, highlightbackground=Col_bg4, bd=0)

title_bar.pack(expand=0, fill="x")
close_button.pack(side=tkr.RIGHT)
maximise_button.pack(side=tkr.RIGHT)
minimise_button.pack(side=tkr.RIGHT)
menu_button.pack(side=tkr.LEFT, padx=(50,10))

# 可选：添加窗口拖动功能（自定义标题栏后默认不能拖动）
def drag_window(event):
    window.geometry(f"+{event.x_root}+{event.y_root}")

title_bar.bind("<B1-Motion>", drag_window)

window.mainloop()

额外提示 #

• 确保images/menu.png路径正确：如果是相对路径，要保证这个文件夹和你的脚本在同一目录下，或者使用绝对路径。
• 如果你后续在类中编写这段代码，要注意保存图片对象的引用（比如用self.menu_image），避免被Python垃圾回收机制回收导致图片不显示。

内容的提问来源于stack exchange，提问作者Joey Park