Tkinter开发Pip-boy GUI点击按钮后按钮间距异常问题

问题现象 #

开发《辐射3》风格Pip-boy GUI时，点击左侧技能按钮（除Lockpick外），按钮之间的垂直间距会出现错乱：

• 预期正常效果：
  
• 点击Barter按钮后的异常效果：
  

问题原因 #

这个问题是Tkinter grid布局的默认自适应规则导致的，核心原因如下：

1. 描述标签布局设置错误：用于显示技能描述的desc标签被固定放在row=2, column=1位置，且没有设置行跨度rowspan，默认只占据第2行的单个单元格空间。
2. grid布局默认会自动调整每一行的高度，适配该行内最高组件的尺寸：初始状态下desc文本为空，高度很小，所有行的高度都适配2单位高的按钮，因此间距均匀；点击按钮加载技能描述后，多行文本会把desc撑高，由于desc只放在第2行，整行高度会被拉伸到和desc一致，放在第2行的Big Guns按钮就会处于这个超高行的中间位置，上下出现大块空白，视觉上就是按钮间距错乱。
3. Lockpick按钮点击后无异常，是因为Lockpick对应的技能描述文本行数极少，desc加载后高度和空状态接近，不会撑大第2行高度。

另外原代码存在冗余无效内容：创建的frame组件没有承载任何组件，属于无用代码；按钮的command回调绕路读取grid_info()获取行号的写法完全没必要。

修复方案 #

按以下三点修改即可解决问题：

• 给描述标签desc添加rowspan参数，让它跨左侧按钮覆盖的所有行（从row=2开始共11行，覆盖到最后一个按钮所在的row=12即可），同时添加sticky=N参数让描述文本靠单元格顶部对齐，避免撑高单行。
• 删除无用的空frame代码。
• 简化按钮command的传参逻辑，循环时直接传入对应技能的索引，不需要运行时读取grid信息。

修复后的完整代码如下：

from tkinter import *

# 读取技能描述文本（请确保skills.txt和脚本在同目录）
with open("skills.txt") as f:
    lines = f.readlines()

# 点击按钮更新对应技能描述
def show_skill_desc(index):
    desc['text'] = lines[index]


root = Tk()
root.geometry("1024x600")
root.title("Skills")

# 顶部标题
Label(root, text="Stats").grid(row=0, column=0)

# 技能列表
skills_list = ["Barter", "Big Guns", "Energy Weapons", "Explosives", "Lockpick", "Medicine",
               "Melee Weapons", "Repair", "Science", "Small Guns", "Sneak", "Speech", "Unarmed"]

# 技能描述标签，设置跨11行、顶部对齐
desc = Label(root, text="", padx=30, wraplength=600, justify=LEFT)
desc.grid(row=2, column=1, rowspan=11, sticky=N)

# 批量创建技能按钮
button_list = []
for i in range(12):
    btn = Button(
        root, 
        text=skills_list[i], 
        width=40,
        height=2, 
        command=lambda c=i: show_skill_desc(c), 
        padx=0, 
        pady=0
    )
    btn.grid(row=i+1, column=0)
    button_list.append(btn)

root.mainloop()

修改后不管点击哪个按钮，描述标签的高度都会由跨的11行共同承载，不会单独撑大某一行的高度，按钮间距会始终保持均匀。

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