Tkinter中Scrollable Cards滚动失效问题求助

我要做一个带问题描述卡片的着陆页，用Frame作为承载内容的卡片组件，但核心问题是main_canvas无法实现滚动——一开始把滚动条放进画布后，画布直接缩成滚动条的尺寸，后来我创建了滚动条Frame解决了尺寸问题，但滚动条还是不能正常工作，调了布局也没用，原代码如下：

from tkinter import *

def close_win(e):
   main_window.destroy()
main_window = Tk()

main_window.attributes('-fullscreen',True)
main_window.config(bg="#1b2036")
main_canvas = Canvas(
    main_window,
    bg='red',
    height= 715,
    width=1300,
    bd=0,
    highlightthickness=0,
    relief='ridge',
)
scroll_bar_frame=Frame(main_canvas,height=715,bg="white")


frame_12= Frame(
    
    main_canvas,
    bg="white",
    relief="sunken",
    borderwidth=0,
    width=100,
    height=200
)
mls_descript2=Label(
    frame_12,
    text='Multilevel Search is a 2D data \nstructure in which each node \nhas a next and child pointer.',
    background="#1b2036",
    border=0,
    font=('Poppins Bold',18*-1),
    fg="white",
    justify=LEFT
)
main_canvas.pack()
main_canvas.create_window(0,0, window=frame_12,anchor="nw")
#main_canvas.create_window(1280,357,window=scroll_bar_frame,anchor="e")
vbar=Scrollbar(main_window,orient=VERTICAL)
vbar.pack(side=RIGHT,fill = Y)
main_canvas.config(yscrollcommand=vbar.set)
vbar.config(command=main_canvas.yview)
for i in range(100):
    frame_13= Frame(
    frame_12,
    bg="yellow",
    relief="sunken",
    borderwidth=0,
    width=100,
    height=200
    )  
    frame_13.pack(padx=5,pady=5)

main_window.bind('<Escape>', lambda e: close_win(e))
main_window.mainloop()

修复后的代码 #

from tkinter import *

def close_win(e):
    main_window.destroy()

main_window = Tk()
main_window.attributes('-fullscreen', True)
main_window.config(bg="#1b2036")

# 主画布与滚动条布局调整
main_canvas = Canvas(
    main_window,
    bg='red',
    height=715,
    width=1300,
    bd=0,
    highlightthickness=0,
    relief='ridge'
)
vbar = Scrollbar(main_window, orient=VERTICAL, command=main_canvas.yview)
main_canvas.config(yscrollcommand=vbar.set)

# 滚动条和画布并排布局
main_canvas.pack(side=LEFT, fill=BOTH, expand=True)
vbar.pack(side=RIGHT, fill=Y)

# 内部容器Frame，所有卡片放在这里
frame_12 = Frame(main_canvas, bg="white")
# 将容器Frame添加到画布中
canvas_window = main_canvas.create_window(0, 0, window=frame_12, anchor="nw")

# 添加标题标签
mls_descript2 = Label(
    frame_12,
    text='Multilevel Search is a 2D data \nstructure in which each node \nhas a next and child pointer.',
    background="#1b2036",
    border=0,
    font=('Poppins Bold', 18),
    fg="white",
    justify=LEFT
)
mls_descript2.pack(padx=10, pady=10)

# 生成测试用卡片
for i in range(100):
    frame_13 = Frame(
        frame_12,
        bg="yellow",
        relief="sunken",
        borderwidth=0,
        width=100,
        height=200
    )
    frame_13.pack(padx=5, pady=5)

# 关键：监听内部容器尺寸变化，更新画布滚动区域
def update_scrollregion(event):
    main_canvas.configure(scrollregion=main_canvas.bbox("all"))

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

main_window.bind('<Escape>', close_win)
main_window.mainloop()

核心修改点 #

• 布局调整：画布用side=LEFT, fill=BOTH, expand=True占满左侧空间，滚动条side=RIGHT, fill=Y垂直填满右侧，避免画布被滚动条挤压。
• 移除冗余组件：删掉没用的scroll_bar_frame，滚动条直接挂载主窗口即可。
• 滚动区域动态更新：绑定内部Frame的<Configure>事件，每次内容撑开容器时，自动更新画布的scrollregion为所有内容的边界，这是滚动生效的关键。
• 修复字体参数：把font=('Poppins Bold',18*-1)改成18，避免负号导致字体异常。
• 完善元素布局：给标签和卡片添加pack的padx/pady参数，确保内容正确排列并撑开容器Frame，让画布能识别真实内容高度。

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