如何在Tkinter计算器GUI中让标题居中显示在按钮上方？

要实现标题"Calculator"居中显示在按钮区域上方，利用grid布局的columnspan参数让标题横跨所有按钮列，同时调整按钮的行号即可，具体修改如下：

修改步骤 #

• 给标题Label添加grid布局，设置columnspan=4（按钮共占4列），让它横跨整个按钮区域，通过pady设置标题与按钮的间距，优化视觉分隔。
• 将所有按钮的row值统一加1，把按钮行向下挪一行，给标题留出顶部空间。

修改后的完整代码 #

from tkinter import *
from tkinter import ttk

#Root
root = Tk()

#Frame
frm = ttk.Frame(root, padding=10)
frm.grid()

#Title - 修改部分：添加grid布局并设置跨列和居中
ttk.Label(frm, text="Calculator", font=('Arial', 14, 'bold')).grid(column=0, row=0, columnspan=4, pady=(0, 10), sticky="n")

#Buttons - 所有按钮的row值加1
ttk.Button(frm, text="%").grid(column=0, row=1)
ttk.Button(frm, text="CE").grid(column=1, row=1)
ttk.Button(frm, text="C").grid(column=2, row=1)
ttk.Button(frm, text="Del").grid(column=3, row=1)

ttk.Button(frm, text="1/x").grid(column=0, row=2)
ttk.Button(frm, text="Sq").grid(column=1, row=2)
ttk.Button(frm, text="Sqrt").grid(column=2, row=2)
ttk.Button(frm, text="÷").grid(column=3, row=2)

ttk.Button(frm, text="7").grid(column=0, row=3)
ttk.Button(frm, text="8").grid(column=1, row=3)
ttk.Button(frm, text="9").grid(column=2, row=3)
ttk.Button(frm, text="x").grid(column=3, row=3)

ttk.Button(frm, text="4").grid(column=0, row=4)
ttk.Button(frm, text="5").grid(column=1, row=4)
ttk.Button(frm, text="6").grid(column=2, row=4)
ttk.Button(frm, text="-").grid(column=3, row=4)

ttk.Button(frm, text="1").grid(column=0, row=5)
ttk.Button(frm, text="2").grid(column=1, row=5)
ttk.Button(frm, text="3").grid(column=2, row=5)
ttk.Button(frm, text="+").grid(column=3, row=5)

ttk.Button(frm, text="+/-").grid(column=0, row=6)
ttk.Button(frm, text="0").grid(column=1, row=6)
ttk.Button(frm, text=".").grid(column=2, row=6)
ttk.Button(frm, text="=").grid(column=3, row=6)

#Main Loop
root.mainloop()

关键参数说明 #

• columnspan=4：让标题Label横跨4列，覆盖所有按钮的列范围，是实现居中的核心。
• pady=(0, 10)：设置标题下方的间距为10像素，避免标题与按钮紧贴，提升视觉舒适度。
• sticky="n"：明确标题在跨列区域内顶部居中显示（不设置默认也会居中，添加后逻辑更清晰）。

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