Tkinter grid and widget size

Question

I am actually learning Tkinter and I want to do a window looking like this (tetris GUI) : image So I want to do a 20x15 grid (h x w) with a tile size of 25px (so 500px x 375px playArea size) So here is the code I made :

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()

I use HEIGHT and WIDTH variables to define the size of my canvas and my TILE_SIZE variable to define te amount of tile is needed (to configure columnspan and rowspan) my first problem is that my :

print(playarea.grid_size())

Return (0,0), as I configured columnspan and rowspan it should return me (10,20), no ?

Then the other one issue is with my buttons, here I created two buttons (newGame and test), I want the newGame to be 75px wide (or 3 * TILE_SIZE) but when I run it (for both of width = 75 and width = 3 * TILE_SIZE) the

print(newGameButton.winfo_width())

Return me 617px and the button is huge, I don't understand why, can someone explain how grid works ? What's causing this.

Bryan Oakley Bryan Oakley · Accepted Answer · 2019-01-09T22:54:16

print(playarea.grid_size())

Return (0,0), as I configured columnspan and rowspan it should return me (10,20), no ?

No. grid_size returns the size (number of rows and columns) of the grid. This is how the computation of the value is made, according to the official tcl/tk documentation:

"The size is determined either by the slave occupying the largest row or column, or the largest column or row with a minsize, weight, or pad that is non-zero."

In your specific case you've only put widgets in row 0, column 0, so the reported size of (0,0) is correct.

print(newGameButton.winfo_width())

Return me 617px and the button is huge, I don't understand why, can someone explain how grid works ? What's causing this.

When you create a button with text but no image, the width is interpreted as a number of characters rather than pixels.

Tkinter grid and widget size

1 Answers