如何使用 pack 或 grid 实现以下 Tkinter GUI 布局?

2023-12-22

这是我当前的跳棋游戏 GUI 布局:

正如您所看到的,它由顶部的菜单、左侧的画布(用于绘制棋盘)、右上角的工具栏(框架)(其中有各种格式/导航按钮)以及使用的文本小部件组成。来注释动作。目前,我正在为小部件使用网格布局。

这是我需要做的:

  1. 当文本量大于小部件大小时,能够在文本小部件中显示/隐藏滚动条。 (这似乎需要网格布局,根据本文 http://effbot.org/zone/tkinter-autoscrollbar.htm.)
  2. 更改文本小部件中文本的字体和/或大小[通过首选项对话框],并且不要在文本小部件周围留下奇怪的间隙。 (这似乎需要包布局,因为文本小部件只能以字符而不是像素为单位给出宽度和高度......这意味着当我更改字体或大小时,文本小部件会增大或缩小,并且窗口不会调整以适应网格布局。我一直在尝试使用 Font.measure 根据所选字体调整文本小部件的大小,但我仍然遇到间隙,因为我无法将小部件的大小调整到精确的像素。)
  3. 我的最终解决方案需要是跨平台的(Windows 和 Linux,希望还有 Mac)。

我可以使用哪种布局来满足我的要求?如果两者都不能完全工作,哪种布局(网格或包)将使我最接近我的目标?谢谢!


对于这个简单的布局,您可以使用grid, pack或两者。在这种特殊情况下,两者都没有明显的优势。两者都有您想要的调整大小行为。

在我的头顶上,我会使用一个水平框架来固定按钮,并将按钮装在里面。然后我可能会使用网格将工具栏、文本小部件和滚动条放置在框架内。也可以使用 Pack,两者都可以。这会照顾到右侧。

如果您希望菜单栏像图片中那样(即:非标准,仅在棋盘上),我会使用类似的技术:左侧的另一个框架,菜单栏位于顶部,棋盘位于底部。

然后我会在主窗口中使用 pack,状态栏位于底部,棋盘位于左侧,然后文本区域位于右侧。

但是,最好使用标准菜单栏,这意味着您不需要棋盘/菜单栏组合的包含框架

这是使用标准菜单栏的一种解决方案的快速破解方法。这使用了将大多数小部件作为父部件的子部件的技术,然后使用in_参数将它们放入容器中。这使得以后更改布局变得更加容易,因为您不必更改整个层次结构,而只需更改容器中小部件的位置。

import Tkinter as tk
import random

class App(tk.Tk):
    def __init__(self, *args, **kwargs):
        tk.Tk.__init__(self, *args, **kwargs)

        size = 40
        menubar = tk.Menu(self)
        menubar.add_cascade(label="Game")
        menubar.add_cascade(label="Options")
        menubar.add_cascade(label="Help")
        chessboard = tk.Canvas(width=8*size, height=8*size, borderwidth = 0,
                               highlightthickness=0)
        statusbar = tk.Label(self, borderwidth=1, relief="sunken")
        right_panel = tk.Frame(self, borderwidth = 1, relief="sunken")
        scrollbar = tk.Scrollbar(orient="vertical", borderwidth=1)
        # N.B. height is irrelevant; it will be as high as it needs to be
        text = tk.Text(background="white",width=40, height=1, borderwidth=0, yscrollcommand=scrollbar.set)
        scrollbar.config(command=text.yview)

        toolbar = tk.Frame(self)
        for i in range(10):
            b = tk.Button(self, text="B%s" % i, borderwidth=1)
            b.pack(in_=toolbar, side="left")

        self.config(menu=menubar)
        statusbar.pack(side="bottom", fill="x")
        chessboard.pack(side="left", fill="both", expand=False)
        toolbar.grid(in_=right_panel, row=0, column=0, sticky="ew")
        right_panel.pack(side="right", fill="both", expand=True)
        text.grid(in_=right_panel, row=1, column=0, sticky="nsew")
        scrollbar.grid(in_=right_panel, row=1, column=1, sticky="ns")
        right_panel.grid_rowconfigure(1, weight=1)
        right_panel.grid_columnconfigure(0, weight=1)

if __name__ == "__main__":
    app = App()
    app.mainloop()
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 pack 或 grid 实现以下 Tkinter GUI 布局? 的相关文章

随机推荐