Python Tkinter带按钮的横向滚动条无法正常工作求助

你在Tkinter中实现横向滚动的图片按钮区域时，遇到滚动条显示但滚动无法展示更多内容的问题，核心原因是Scrollable类中强制限制了内部容器的宽度，导致横向内容被压缩，无法触发正确的滚动范围计算。

关键问题点及修复： #

• 错误的容器宽度强制设置：原__fill_canvas方法把canvas内部的window item宽度设为canvas宽度，导致横向排列的按钮总宽度超过canvas时，容器被强行压缩，无法正确计算滚动范围。
• 类继承初始化错误：Scrollable继承自ttk.Frame，但初始化时用了tk.Frame.__init__，可能导致布局行为异常。
• 滚动范围计算时机：需要确保在子控件添加完成后，正确更新canvas的滚动区域。

修改后的完整代码： #

import tkinter as tk
from tkinter import ttk

class Scrollable(ttk.Frame):
    def __init__(self, frame, width=16):
        # 修正继承初始化，匹配ttk.Frame的构造方法
        ttk.Frame.__init__(self, frame)
        
        scrollbar = tk.Scrollbar(frame, width=width, orient='horizontal')
        scrollbar.pack(side=tk.BOTTOM, fill=tk.X, expand=True)
        
        self.canvas = tk.Canvas(frame, width=800, height=120, bg='white', xscrollcommand=scrollbar.set)
        self.canvas.pack(side=tk.LEFT, fill=tk.BOTH, expand=True)
        scrollbar.config(command=self.canvas.xview)
        
        self.windows_item = self.canvas.create_window(0, 0, window=self, anchor=tk.W)
        
        # 绑定容器自身的大小变化事件，实时更新滚动范围
        self.bind('<Configure>', self.__update_scrollregion)

    def __update_scrollregion(self, event):
        # 当内部容器因子控件添加而改变大小时，更新canvas的滚动范围
        self.canvas.config(scrollregion=self.canvas.bbox(self.windows_item))

    def update(self):
        # 确保所有子控件布局完成后，重新计算滚动范围
        self.update_idletasks()
        self.canvas.config(scrollregion=self.canvas.bbox(self.windows_item))

# 示例使用逻辑（替换为你的业务代码）
if __name__ == "__main__":
    root = tk.Tk()
    root.title("横向滚动图片按钮")
    
    scroll_frame = ttk.Frame(root)
    scroll_frame.pack(fill=tk.BOTH, expand=True, padx=10, pady=10)
    
    scrollable_body = Scrollable(scroll_frame)
    
    # 模拟图片数据（实际使用替换为你的PhotoImage对象）
    PHOTOS = [[tk.PhotoImage(width=100, height=110) for _ in range(10)] for _ in range(1)]
    BTNS = []
    i = 1
    
    for index in range(i):
        if len(PHOTOS[index]) > 0:
            for k, photo in enumerate(PHOTOS[index]):
                btn = tk.Button(scrollable_body, highlightbackground='red', fg='red', text="",
                               bg='white', border='0', image=photo, 
                               command=lambda index=index, k=k: print(f"点击按钮：{index}-{k}"),
                               compound=tk.LEFT, width=100, height=110)
                btn.pack(side="left", fill="both", expand="no", padx=5, pady=5)
                BTNS.append(btn)
    
    scrollable_body.update()
    
    root.mainloop()

修改说明： #

1. 修正类初始化逻辑：将tk.Frame.__init__(self, frame)改为ttk.Frame.__init__(self, frame)，保证继承关系的一致性。
2. 移除错误的宽度限制：删除原__fill_canvas方法及对应的<Configure>绑定，让内部容器根据子控件总宽度自动扩展，不再被canvas宽度强制压缩。
3. 绑定容器大小变化事件：给Scrollable自身绑定<Configure>事件，当按钮添加完成导致容器宽度变化时，自动更新canvas的滚动范围。
4. 保留update方法作用：在所有子控件添加完成后调用update()，确保滚动范围计算基于最终的容器尺寸。

修改后，横向滚动条即可正常滚动展示所有图片按钮。

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