添加Scrollbar后CTk Frame的Grid布局异常，如何维持指定尺寸？

问题原因 #

添加垂直Scrollbar后布局打乱、两Frame宽度一致，核心原因是：

• 承载带滚动Frame的容器（如CTkScrollableFrame或自定义canvas容器）未固定宽度，且Grid布局时设置了sticky="nsew"，导致容器被横向拉伸填充整列；
• __main_container的列配置被滚动容器的布局覆盖，原有的列宽锁定失效。

解决方案 #

1. 锁定主容器的列宽配置 #

确保__main_container的列设置保持原有的宽度规则：

• 给__image_frame所在的列设置minsize固定宽度；
• 另一列设置weight=1用于拉伸填充剩余空间。

2. 固定滚动容器的宽度 #

使用CTkScrollableFrame作为滚动容器时：

• 初始化时指定width参数，匹配原__image_frame的宽度；
• Grid布局滚动容器时，仅设置sticky="ns"（垂直填充，不横向拉伸），避免容器被拉宽；
• 滚动容器内部的列配置设为weight=1，让__image_frame能填充容器的垂直空间。

修正后代码示例 #

import customtkinter as ctk

class App(ctk.CTk):
    def __init__(self):
        super().__init__()
        self.__main_container = ctk.CTkFrame(self)
        self.__main_container.pack(fill="both", expand=True, padx=10, pady=10)
        
        # 锁定列0宽度，列1自动拉伸
        self.__main_container.grid_columnconfigure(0, minsize=400)
        self.__main_container.grid_columnconfigure(1, weight=1)
        
        # 创建固定宽度的滚动容器
        self.__scroll_container = ctk.CTkScrollableFrame(self.__main_container, width=400)
        self.__scroll_container.grid(row=0, column=0, sticky="ns", padx=5, pady=5)
        # 容器内部列允许拉伸，让子Frame填充垂直空间
        self.__scroll_container.grid_columnconfigure(0, weight=1)
        
        self.__image_frame = ctk.CTkFrame(self.__scroll_container)
        self.__image_frame.grid(row=0, column=0, sticky="nsew", padx=5, pady=5)
        
        self.__control_frame = ctk.CTkFrame(self.__main_container)
        self.__control_frame.grid(row=0, column=1, sticky="nsew", padx=5, pady=5)

手动实现滚动的注意事项 #

如果不用CTkScrollableFrame，自己用canvas+scrollbar实现：

• canvas初始化时设置固定width；
• canvas和scrollbar在Grid布局时，所在列设置minsize；
• 内部Frame绑定canvas的滚动事件，确保滚动正常且Frame宽度不超出canvas。

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