【问题标题】:How to horizontally center all the elements in a scrollable frame using pack and grid layout如何使用包和网格布局将可滚动框架中的所有元素水平居中
【发布时间】:2021-04-30 02:50:16
【问题描述】:

我正在尝试学习如何使框架可滚动。现在我遇到了另一个问题,如何在该框架中水平居中所有小部件。标签,按钮都出现在左侧。我怎样才能将它们水平居中。

import tkinter as tk
from tkinter import ttk

root = tk.Tk()

container = tk.Frame(root)
container.pack(fill="both", expand=True)

canvas = tk.Canvas(container)
canvas.pack(side="left", fill="both", expand=True)

scrollbar = ttk.Scrollbar(container, orient="vertical", command=canvas.yview)
scrollbar.pack(side="right", fill="y")

canvas.configure(yscrollcommand=scrollbar.set)

scrollable_frame = ttk.Frame(canvas)
canvas.create_window((0, 0), window=scrollable_frame, anchor="nw")

scrollable_frame.bind(
    "<Configure>",
    lambda e: canvas.configure(
        scrollregion=canvas.bbox("all")
    )
)

for i in range(50):
    tk.Label(scrollable_frame, text="Sample text").grid(row=i, column=0)
    tk.Button(scrollable_frame, text="Sample text").grid(row=i, column=1)

root.mainloop()

【问题讨论】:

    标签: python tkinter frame


    【解决方案1】:

    您可以计算scrollable_frame左上角所需的位置,并在调整画布大小时使用canvas.coords()移动框架:

    frame_id = canvas.create_window((0, 0), window=scrollable_frame, anchor="nw")
    
    def on_canvas_resize(event):
        x = (event.width - scrollable_frame.winfo_width()) / 2
        canvas.coords(frame_id, (x, 0))
        bbox = (0, 0, event.width, scrollable_frame.winfo_height())
        canvas.config(scrollregion=bbox)
    
    canvas.bind("<Configure>", on_canvas_resize)
    

    【讨论】:

    • 谢谢,第一次最大化窗口全屏没问题,但是如果我再次按下以缩小窗口或从角落按住窗口以更改其大小,则无法正常工作,
    • scrollregion引起的。已更新答案以正确配置 scrollregion
    【解决方案2】:

    我认为您可以在这里找到答案: How to horizontally center a widget using grid()?

    简而言之,由于您为 scrollable_frame (0,0) 提供的坐标,您的标签和按钮位于框架的左侧 尝试将它们修改为 (100, 0),您将看到所有内容都向右移动。然后,如果您知道框架的宽度,则可以使用变量使框架居中。

    这是我对stackoverflow的第一次回复,希望不要太乱!

    【讨论】:

    • 谢谢你,我尝试过这种方式,但我希望他们保持居中,无论页面是否全屏
    猜你喜欢
    • 1970-01-01
    • 2013-10-27
    • 2018-10-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-11-25
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多