Tkinter网格和小部件大小

4

我正在学习Tkinter,希望创建一个类似于俄罗斯方块GUI的窗口:

图片

所以我想要创建一个20x15的网格(高x宽),每个瓦片大小为25像素(因此玩区大小为500像素x375像素)。

这是我编写的代码:

from tkinter import *
from random import randint

root = Tk()
root.resizable(False, False)

# PLAYAREA SIZE
HEIGHT = 500
WIDTH = HEIGHT // 2
TILE_SIZE = 25

playarea = Canvas(root, width=WIDTH, height=HEIGHT, bg='yellow')
playarea.grid(column=6, row=0, columnspan=WIDTH // TILE_SIZE, rowspan=HEIGHT // TILE_SIZE)


menuFrame=Frame(root, width=(WIDTH // 2), height=HEIGHT).grid(column=0, row=0, columnspan= (WIDTH // 2) // TILE_SIZE , rowspan= int(HEIGHT / TILE_SIZE))
newGameButton = Button(menuFrame, text='Start', width= 75 , height = 1 * TILE_SIZE)
newGameButton.grid(column=1, row=1,columnspan=3, rowspan= 1)
newTestButton = Button(menuFrame, text='Test', width= 5 * TILE_SIZE, height = 1* TILE_SIZE)
newTestButton.grid(column=0, row=2, columnspan=5, rowspan=1)
root.update()

print(newGameButton.winfo_width())
print(playarea.grid_size())
#print(playarea.grid_info())

root.mainloop()

我使用 HEIGHT 和 WIDTH 变量来定义画布的大小,使用 TILE_SIZE 变量来定义所需的瓷砖数量(以配置 columnspan 和 rowspan)。我的第一个问题是:

print(playarea.grid_size())

返回(0,0),因为我配置了columnspan和rowspan,它应该返回(10,20),对吧?
然后另一个问题是关于我的按钮,我在这里创建了两个按钮(newGame和test),我想让newGame的宽度为75px(或3*TILE_SIZE),但当我运行它时(对于宽度为75和宽度为3*TILE_SIZE),

print(newGameButton.winfo_width())

返回结果:返回给我617像素,按钮很大,我不明白为什么,有人能解释一下网格布局是如何工作的吗?这是什么原因。
1个回答

1

print(playarea.grid_size())

返回 (0,0),因为我已经配置了 columnspan 和 rowspan,它应该返回 (10,20),对吗?

不对。 grid_size 返回网格的大小(行数和列数)。根据官方的 tcl/tk 文档,计算这个值的方法如下:

"大小是通过占用最大行或列的从属对象或具有非零 minsize、weight 或 pad 的最大列或行来确定的。"

在你的特定情况下,你只把小部件放在了第 0 行、第 0 列,所以报告的大小为 (0,0) 是正确的。

print(newGameButton.winfo_width())

返回 617px,按钮很大,我不明白为什么,有人能解释一下 grid 是如何工作的吗?是什么导致了这种情况。

当你创建一个带文本但没有图像的按钮时,width 被解释为字符数而不是像素数。


谢谢!“当您创建一个带有文本但没有图像的按钮时,宽度被解释为字符数而不是像素。”我自己永远不会发现这一点,那么调整按钮大小的最佳方法是什么?知道字体大小和间距然后设置大小,还是有其他方法? - Sakeiru
@Rikougo:有几种方法。最简单的方法是在文本旁边添加一个1x1像素的图像(并记得定义“compound”选项)。不过,如果它们是文本按钮,并且您希望能够在多台计算机上运行程序,那么个人认为您不应该指定精确的像素大小。让tkinter决定适合文本的宽度即可。 - Bryan Oakley

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接