如何使用 tkinter 设置 3 个或更多帧？

Question

我正在尝试这样做，以便我可以将按钮放在 medFrame 中，但它们出现在 topFrame 中。使用topFrame时，按钮靠在屏幕顶部，看起来很糟糕，所以我认为可以通过使用第三个框架来解决这个问题。

from tkinter import *


root = Tk()
root.title('BulletHead')
root.attributes('-fullscreen', True)
root.resizable(width = NO, height=NO)  

topFrame=Frame(root)
topFrame.pack(side=TOP)

medFrame=Frame(root)
medFrame.pack()

botFrame = Frame(root)
botFrame.pack(side=BOTTOM)

botonJugar = Button(medFrame, text = 'Jugar')
botonJugar.bind("<Button-1>",jugar)
botonJugar.pack()

botonTabla = Button(medFrame, text = 'Tabla de puntajes')
botonTabla.bind("<Button-1>",tabla)
botonTabla.pack()

root.mainloop()

Answer 1

元素已成功添加到中间框架，但它们看起来好像在顶部框架中，因为 topFrame 和 botFrame 没有尺寸，所以它们不会出现（除非你可以感知一个像素）。要为中间框架获得一些间距，您需要为其他框架提供一些尺寸。试试这个给中间框架一些间距：

topFrame=Frame(root, height=200, width=200)
botFrame = Frame(root, height=200, width=200)

另一种方法是查看一些其他选项，以便仅在一帧中使用 pack geometry manager 以获得所需的结果。特别是 expand= 选项有助于将 window.

中的对象居中

from tkinter import *

root = Tk()
root.title('BulletHead')
root.attributes('-fullscreen', True)
root.resizable(width = NO, height=NO)  

medFrame=Frame(root)
medFrame.pack(expand=True)

botonJugar = Button(medFrame, text = 'Jugar')
botonJugar.bind("<Button-1>",jugar)
botonJugar.pack()

botonTabla = Button(medFrame, text = 'Tabla de puntajes')
botonTabla.bind("<Button-1>",tabla)
botonTabla.pack()

root.mainloop()

Answer 2

小部件出现在顶部的原因是 topFrame 是空的。由于它没有高度或宽度，也没有 children，因此它只有一个像素大小。如果你给它一个宽度和高度或者在里面放一些小部件，你会看到按钮实际上在中间框架中。

这是我给框架一个人为的宽度和高度，并强制框架在“x”方向上填充时得到的图像（为了说明目的，还缩小了 window）：

这是我更改的内容（请注意，我还添加了颜色以使框架更容易看清）：

topFrame = Frame(root, bg="pink", height=100)
medFrame = Frame(root, bg="bisque")
botFrame = Frame(root, bg="yellow", height=100)

topFrame.pack(side=TOP, fill="x")
medFrame.pack(fill="x")
botFrame.pack(side=BOTTOM, fill="x")

如果您希望中框占据所有额外的 space，请添加 expand 选项并使其在两个方向上填充：

medFrame.pack(fill="both", expand=True)

将小部件添加到顶部和底部框架后，它们的高度将缩小以适合其内容，从而使顶部创建工具栏和状态栏变得非常容易。

如何使用 tkinter 设置 3 个或更多帧？

How can I set 3 or more Frames using tkinter?

python

tkinter

tkinter-layout