CTkScrollableFrame滚动条致标签左移，如何恢复右对齐？

问题描述 #

用CustomTkinter开发计算器时，显示框包含总表达式和当前表达式两个标签，原本通过anchor="e"和sticky="nsew"实现了右对齐。但将显示框从CTkFrame替换为CTkScrollableFrame后，两个标签全部左移，修改anchor属性也无法恢复右对齐，需要保留滚动条的同时让标签回到右侧。

解决方案 #

问题根源在于CTkScrollableFrame的内部结构：它的外层容器下嵌套了一个专门承载内容的内部frame（.scrollable_frame），直接将标签加到外层容器会导致布局规则失效。正确做法是把标签放到内部frame中，并配置内部frame的网格权重。

修改后的完整代码 #

from customtkinter import *

# 假设以下常量已提前定义
DARK_GRAY = "#2D2D2D"
GRAY = "#4D4D4D"
SMALL = "Arial"
LARGE = "Arial"

class Calculator(CTk):
    def __init__(self):
        super().__init__()
        self.totalExpression = ""
        self.currentExpression = ""
        self.create_display_frame()

    def create_display_frame(self):
        """创建带滚动条的显示框，包含总表达式和当前表达式标签"""
        # 替换原CTkFrame为CTkScrollableFrame
        self.displayFrame = CTkScrollableFrame(self, width=400, height=150, 
                                              fg_color=DARK_GRAY, border_width=5,
                                              border_color=GRAY, corner_radius=0)
        self.displayFrame.grid(row=0, column=0, sticky="nsew")
        self.grid_rowconfigure(0, weight=1)
        self.grid_columnconfigure(0, weight=1)

        # 获取ScrollableFrame的内部内容容器
        inner_frame = self.displayFrame.scrollable_frame
        # 配置内部容器的网格权重，让标签能占满宽度
        inner_frame.grid_rowconfigure(0, weight=1)
        inner_frame.grid_rowconfigure(1, weight=1)
        inner_frame.grid_columnconfigure(0, weight=1)

        # 将标签挂载到内部容器上
        self.totalLabel = CTkLabel(inner_frame, text=self.totalExpression, anchor="e", 
                                  padx=15, pady=20, font=(SMALL, 22), text_color="white")
        self.totalLabel.grid(row=0, column=0, sticky="nsew")

        self.currentLabel = CTkLabel(inner_frame, text=self.currentExpression, anchor="e", 
                                    padx=15, pady=20, font=(LARGE, 50), text_color="white")
        self.currentLabel.grid(row=1, column=0, sticky="nsew")

if __name__ == "__main__":
    app = Calculator()
    app.mainloop()

关键步骤说明 #

1. 替换容器类型：将原CTkFrame替换为CTkScrollableFrame，保留原有样式参数。
2. 操作内部容器：通过self.displayFrame.scrollable_frame获取ScrollableFrame的内部内容容器，所有需要滚动的组件必须挂载到这个容器上。
3. 配置内部网格：给内部容器的行列设置weight=1，确保标签能占满容器宽度；配合sticky="nsew"让标签拉伸，再通过anchor="e"实现文本右对齐。

内容的提问来源于stack exchange，提问作者Maťo Valapka