如何在带滚动条的Tkinter Canvas中精确对齐Spinbox组件？

要实现Spinbox与矩形网格对齐且随滚动条同步移动，核心是将所有元素（Spinbox和网格）放在同一个可滚动的容器Frame中，通过grid()布局实现精准对齐。以下是完整实现代码及关键说明：

完整代码 #

import tkinter as tk
from tkinter import ttk

cellule_taille = 50
rows = 10
cols = 10

root = tk.Tk()
root.title("对齐的网格与Spinbox")

# 主窗口网格配置，让Canvas自适应大小
root.grid_rowconfigure(0, weight=1)
root.grid_columnconfigure(0, weight=1)

# 创建滚动Canvas及滚动条
grille_canvas = tk.Canvas(root, borderwidth=2, relief="solid")
grille_canvas.grid(row=0, column=0, sticky="nsew")

yscrollbar = ttk.Scrollbar(root, orient="vertical", command=grille_canvas.yview)
yscrollbar.grid(row=0, column=1, sticky="ns")
xscrollbar = ttk.Scrollbar(root, orient="horizontal", command=grille_canvas.xview)
xscrollbar.grid(row=1, column=0, sticky="ew")

grille_canvas.config(yscrollcommand=yscrollbar.set, xscrollcommand=xscrollbar.set)

# 创建容器Frame，作为滚动内容的载体
container = tk.Frame(grille_canvas)
grille_canvas.create_window((0, 0), window=container, anchor="nw")

# 配置容器的网格布局：统一列宽行高，确保元素对齐
for col in range(cols + 1):
    container.grid_columnconfigure(col, minsize=cellule_taille)
for row in range(rows + 1):
    container.grid_rowconfigure(row, minsize=cellule_taille)

# 放置左侧行Spinbox
for r in range(rows):
    spin_row = tk.Spinbox(container, from_=0, to=cols, width=2)
    spin_row.grid(row=r+1, column=0, padx=5, pady=5, sticky="nsew")

# 放置顶部列Spinbox
for c in range(cols):
    spin_col = tk.Spinbox(container, from_=0, to=rows, width=2)
    spin_col.grid(row=0, column=c+1, padx=5, pady=5, sticky="nsew")

# 创建网格绘制区域
grid_canvas = tk.Canvas(container, bg="white", highlightthickness=0)
grid_canvas.grid(row=1, column=1, rowspan=rows, columnspan=cols, sticky="nsew")

# 绘制矩形网格
for r in range(rows):
    for c in range(cols):
        x0 = c * cellule_taille
        y0 = r * cellule_taille
        x1 = x0 + cellule_taille
        y1 = y0 + cellule_taille
        grid_canvas.create_rectangle(x0, y0, x1, y1, fill="white", outline="black")

# 更新滚动区域，确保所有内容可滚动
def update_scrollregion(event):
    grille_canvas.config(scrollregion=grille_canvas.bbox("all"))

container.bind("<Configure>", update_scrollregion)

root.mainloop()

关键实现说明 #

1. 统一滚动容器
   将Spinbox和网格都放入同一个container Frame中，再通过create_window将该Frame嵌入滚动Canvas。这样拖动滚动条时，所有元素会同步移动，解决了原place()方案中Spinbox不随滚动的问题。

2. 精准网格对齐
   通过grid_columnconfigure和grid_rowconfigure为container的所有列、行设置统一的最小尺寸cellule_taille，确保Spinbox的单元格与网格单元格大小完全匹配，自然对齐。

3. 滚动区域自动更新
   绑定container的<Configure>事件，当容器大小变化时自动更新Canvas的scrollregion，保证所有内容都在滚动范围内。

4. 网格区域的独立Canvas
   单独使用一个Canvas绘制矩形网格，放置在container的中间区域（跨所有行和列），既保证网格绘制的灵活性，又能与周围的Spinbox完美对齐。

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