Creating a matrix over an image

Question

I decided to set the background image as the game board so that I wouldn't have to draw it every frame. The problem I am having now though it trying to create a matrix over this image in which the game pieces align where I want them. Not sure if I am doing this the most easy way, but here is what I have so far

This is my image

import pygame
import HasamiShogiGame1


# CONSTANTS
width = 700
height = 700
SQUARE_SIZE = 60
screen = pygame.display.set_mode((width, height))

positions = {}
for row in range(9):
    for col in range(9):
        x = col * SQUARE_SIZE + 50
        y = row * SQUARE_SIZE + 50
        positions[row,col] = (x,y)

# Initialize Pygame
pygame.init()

# Background Image and Scales to size
background = pygame.image.load("image/background.png")
background = pygame.transform.scale(background, (700,700))

# Create a HasamiShogiGame object and retrieve the game board
game = HasamiShogiGame1.HasamiShogiGame()
board = game.get_board()

while True:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            pygame.quit()
    screen.blit(background, (0,0))

    # Iterate through the game board and draw the pieces at their corresponding positions
    for row in range(9):
        for col in range(9):
            value = board[row][col]
            pos = positions[row, col]
            if value == "B":
                pygame.draw.circle(background, (0, 0, 0), pos, SQUARE_SIZE // 2 - 10)
            elif value == "R":
                pygame.draw.circle(background, (255, 0, 0), pos, SQUARE_SIZE // 2 - 10)


    pygame.display.update()

I believe the pieces need to be shifted about 100 pixels but I don't know how I would approach that here. I'm not actually sure I'm going about doing this the most simplest way either

*"The problem I am having now though it trying to create a matrix over this image in which the game pieces align where I want them."* - Where do you want the game pieces to be? Please note that we cannot see the image. — Rabbid76, Jan 18 '23 at 05:58
@Rabbid76 I was wondering just in general how I would maneuver a matrix, be also here is what I am dealing with https://imgur.com/a/WBiA1WX — spam.i.am, Jan 18 '23 at 16:00

Rabbid76 · Answer 1 · 2023-01-18T16:24:39.587

The top left corner of the field "a1" of the grid on the image appears to be at (110, 130). The 3rd argument of pygame.draw.circle() is the center of the circle. I suggest creating a grid of pygame.Rect objects and finding the center of the cell with the center attribute:

grid_left = 110
grid_top = 130
positions = {}
for row in range(9):
    for col in range(9):
        x = col * SQUARE_SIZE + grid_left
        y = row * SQUARE_SIZE + grid_top
        positions[row,col] = pgame.Rect(x, y, SQUARE_SIZE, SQUARE_SIZE)

while True:
    # [...]

    for row in range(9):
        for col in range(9):
            value = board[row][col]
            rect = positions[row, col]
            radius = SQUARE_SIZE // 2 - 10
            if value == "B":
                pygame.draw.circle(background, (0, 0, 0), rect.center, radius)
            elif value == "R":
                pygame.draw.circle(background, (255, 0, 0), rect.center, radius)

Creating a matrix over an image

1 Answers1