Making a 5x5 Board using a grid in Tkinter

Question

Im making one of my first programs, using python, tkinter and pillow.

This program is supposed to randomly select one of four tile images, create an image and repeat 25 times Making a 5x5 Board using a grid to position the images in a square.

This is not what happened when i ran my code though

One or two columns and 4 rows are usually generated and not every coordinate is filled with an image.
And only the corner of the images are visible for some reason?
The images center seems to be placed in the top left corner of their grid.

A output might look something like this

X = coordinate filled with an image

O = coordinate filled with bg colour

---

XX

OX

OX

---

When i want it to look like this

---

XXXXX

XXXXX

XXXXX

XXXXX

XXXXX

---

The code thats supposed to place the images looks like this

while n < 25:
n = n + 1
number = random.randint(1,4)

if number == 1:

    TILE_FLOWER.grid(row = x, column = y)
    TILE_FLOWER.create_image(16,16, image = TILE_FLOWER_IMG)

elif number == 2:
    TILE_GRASS.grid(row = x, column = y)
    TILE_GRASS.create_image(16,16, image = TILE_GRASS_IMG)

elif number == 3:
    TILE_STONE.grid(row = x, column = y)
    TILE_STONE.create_image(16,16, image = TILE_STONE_IMG)

elif number == 4:
    TILE_WATER.grid(row = x, column = y,)
    TILE_WATER.create_image(16,16, image = TILE_WATER_IMG)

if x == 5:
    x = 0
    y = y + 1

else:
    x = x + 1


win.mainloop()

---

The code defining my canvases looks like this
They're the same size as the images i want to draw on them.

---

TILE_FLOWER = Canvas(win, height = 80, width = 80)
TILE_GRASS = Canvas(win, height = 80, width = 80)
TILE_STONE = Canvas(win, height = 80, width = 80)
TILE_WATER = Canvas(win, height = 80, width = 80)

---

And lastly the code defining the images looks like this

---

TILE_FLOWER_IMG = PhotoImage(file = 'Path1.png')
TILE_GRASS_IMG = PhotoImage(file = 'Path2.png')
TILE_STONE_IMG = PhotoImage(file = 'Path3.png')
TILE_WATER_IMG = PhotoImage(file = 'Path4.png')

---

Hope what i've written makes sense!
And i would be super thankful if someone could help me fix this mess :)

Answer 1

You need to create new Label or Canvas in each cell of the 5x5 grid:

import tkinter as tk
import random

root = tk.Tk()

imagelist = [
    tk.PhotoImage(file='Path1.png'),
    tk.PhotoImage(file='Path2.png'),
    tk.PhotoImage(file='Path3.png'),
    tk.PhotoImage(file='Path4.png'),
]

for i in range(25):
    image = random.choice(imagelist)
    tk.Label(root, image=image, width=80, height=80, bg='white').grid(row=i//5, column=i%5)
    '''
    # or using Canvas
    canvas = tk.Canvas(root, width=80, height=80, bg='white')
    canvas.create_image(40, 40, image=image)
    canvas.grid(row=i//5, column=i%5)
    '''

root.mainloop()

Or using single Canvas :

canvas = tk.Canvas(root, width=400, height=400, bg='white')
canvas.pack()

for i in range(25):
    image = random.choice(imagelist)
    row = i // 5
    col = i % 5
    canvas.create_image(40+col*80, 40+row*80, image=image)