【问题标题】:How do I align something to the bottom left in Tkinter using either .grid() or .pack()?如何使用 .grid() 或 .pack() 在 Tkinter 中将某些内容对齐到左下角?
【发布时间】:2020-04-19 12:06:58
【问题描述】:

我目前正在尝试在 Tkinter 中制作一个使用多个不同窗口的游戏。
但是,当我尝试创建辅助窗口的布局时,我似乎无法在列表框下方找到我的Return to Menu 按钮,并与左侧对齐。我已经尝试使用.pack().grid() 方法,但它们对我来说没有意义。

我尝试过使用.pack()

header = Frame(wn).pack()
title = Label(header, text='Single-Player',font=('Arial bold',20),bg=bgcolor).pack(anchor='center')
footer = Frame(wn).pack(side=BOTTOM)

return_to_menu = Button(footer, text='Return to Main Menu',font=('Arial',16),bg=bgcolor,command=lambda: menu()).pack(side=BOTTOM,padx=20,pady=250)

# body frame (left side)
bodyL = Frame(wn).pack(side=LEFT)

#output box
output = Listbox(bodyL, width=50, font=("Arial", 20)).pack(side=LEFT,padx=15)`

我已经尝试过使用.grid()

header = Frame(wn).grid(sticky=N)
title = Label(header, text='Single-Player',font=('Arial bold',20),bg=bgcolor).grid(sticky=N+E+W,row=0,column=0)
footer = Frame(wn).grid(sticky=S)

return_to_menu = Button(footer, text='Return to Main Menu',font=('Arial',16),bg=bgcolor,command=lambda: menu()).grid(sticky=S,padx=20,row=0,column=0)

# body frame (left side)
bodyL = Frame(wn).grid(sticky=W)

#output box
output = Listbox(bodyL, width=50, font=("Arial", 20)).grid(sticky=W,padx=15, )`

但是,使用 .grid() 后,我的标题不再与屏幕中心对齐。
有没有办法更有效地居中 - 我不喜欢使用 padx=450 让它居中。
按钮和列表框发生的情况是按钮出现在列表框的左侧,而不是底部。我尝试了其他几种方法,例如增加行号,但我的脚本似乎没有达到我的预期。

【问题讨论】:

  • 使用 grid() 时需要使用权重。 columnconfigure 和 rowconfigure 就是你要找的。​​span>
  • 看看this post。我将详细介绍grid() 几何管理器。应该有助于清理使用一些。

标签: python python-3.x user-interface tkinter


【解决方案1】:

这是一个示例,说明如何设置特定列和行的权重以使小部件粘在屏幕上的特定位置。

使用grid() 我们需要使用columnconfigure()rowconfigure() 来完成这项工作。

这两种方法用于定义随着容器的增长或缩小,列或行相对于其周围列或行的扩展比例。

请参阅下面的示例,如果您有任何问题,请告诉我:

import tkinter as tk


root = tk.Tk()

for i in range(3):
    root.columnconfigure(i, weight=1)

root.rowconfigure(1, weight=1)

tk.Label(root, text='Top left').grid(row=0, column=0, sticky='w')
tk.Label(root, text='Top center').grid(row=0, column=1)
tk.Label(root, text='Top right').grid(row=0, column=2, sticky='e')
tk.Label(root, text='center').grid(row=1, column=1)
tk.Label(root, text='Bottom left').grid(row=2, column=0, sticky='w')
tk.Label(root, text='Bottom center').grid(row=2, column=1)
tk.Label(root, text='Bottom right').grid(row=2, column=2, sticky='e')

root.mainloop()

例子:

这是另一个示例,但这次我在框架之外有一个标题标签,以便我们可以更轻松地管理居中的标题,然后将框架的所有其他内容与标题标签分开处理。

import tkinter as tk

root = tk.Tk()
root.columnconfigure(0, weight=1)
root.rowconfigure(1, weight=1)

frame = tk.Frame(root)
frame.grid(row=1, column=0, sticky='nsew')

for i in range(3):
    frame.columnconfigure(i, weight=1)

frame.rowconfigure(1, weight=1)

tk.Label(root, text='Title centered').grid(row=0, column=0)
tk.Label(frame, text='Top left').grid(row=0, column=0, sticky='w')
tk.Label(frame, text='Top center').grid(row=0, column=1)
tk.Label(frame, text='Top right').grid(row=0, column=2, sticky='e')
tk.Label(frame, text='Center').grid(row=1, column=1)
tk.Label(frame, text='Bottom left').grid(row=2, column=0, sticky='w')
tk.Label(frame, text='Bottom center').grid(row=2, column=1)
tk.Label(frame, text='Bottom right').grid(row=2, column=2, sticky='e')
tk.Label(root, text='Footer centered').grid(row=2, column=0)
root.mainloop()

例子:

要解决您在 cmets 中的问题,您不能在创建容器的同一行上使用 grid() 或任何其他几何管理器。这将始终导致该帧的变量返回 None,因为几何管理器在调用时返回 None

查看这张图片,了解当您在创建容器的同一行上使用 grid() 时会发生什么。

现在,如果您删除创建容器的行上的 grid() 部分,然后将其写入下一行,因为上述图像的注释掉部分显示它将按预期工作。请参见下图正确使用容器的 grid()。

要解决您在 cmets 中的第二个问题,您可以添加此行以在左下角提供一个按钮。

tk.Button(root, text='Bottom left button').grid(row=3, column=0, sticky='w')

例子:

【讨论】:

  • 谢谢,这很有帮助。唯一没有的部分是 Python。我已经为 Frames 复制并粘贴了您的示例代码,并且一直收到属性错误消息,指出“rowconfiguration”和“columnconfiguration”不是 NoneType 的属性。我该如何解决这个问题?它适用于主框架,并且标题整齐地居中,但页脚对此不满意。
  • 该错误来自直接在容器上使用几何管理器而不是新行。例如,在我的代码中,您可以看到我在一行上定义框架,然后在新行上应用 grid()。如果你在同一行执行所有操作,那么 `grid()` 将返回 None
  • @Angreyboy 我还更新了我的第二个示例以包含页脚。
  • 非常感谢,最后返回菜单的按钮出现在底部的中心而不是底部的左侧,即使我使用sticky=S+W也是如此。我能做最后一件事吗? :-) (编辑:没关系,请忽略,因为我的页面一分钟前没有刷新以查看您的额外评论)
  • 这是 Stack Overflow 上最好的答案之一
猜你喜欢
  • 1970-01-01
  • 2014-06-21
  • 1970-01-01
  • 2019-05-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-04-30
  • 2020-09-04
相关资源
最近更新 更多