Only 2 sprites added on screen pygame

Question

I'm trying to make a simple pygame maze and I have a problem that only 2 sprites are displayed: a player and a single wall, while i see that they are all added to the sprite list correctly

PINK = (221, 160, 221)
WHITE = (255, 255, 255)
BLUE = (29, 32, 76)

SCREEN_WIDTH = 800
SCREEN_HEIGHT = 600
FPS = 30


class Player(pygame.sprite.Sprite):

    def __init__(self, x, y, img='alien.png'):
        # Call the parent's constructor
        super().__init__()

        self.image = pygame.image.load(img).convert_alpha()
        self.rect = self.image.get_rect()
        self.rect.x = x
        self.rect.y = y

        # Set speed vector
        self.change_x = 0
        self.change_y = 0
        self.walls = None

    def update(self):

        # Horizontal movement
        self.rect.x += self.change_x

        # Check if object stumbles upon an obstacle
        block_hit_list = pygame.sprite.spritecollide(self, self.walls, False)
        for block in block_hit_list:

            if self.change_x > 0:  # If the object was moving right
                self.rect.right = block.rect.left  # Align its right border with the left border of an obstacle

            else:  # If the object was moving left
                self.rect.left = block.rect.right  # Align its left border with the right border of an obstacle

        # Vetical movement
        self.rect.y += self.change_y

        # Check if object stumbles upon an obstacle
        block_hit_list = pygame.sprite.spritecollide(self, self.walls, False)
        for block in block_hit_list:

            if self.change_y > 0:  # If the object was moving up
                self.rect.bottom = block.rect.top  # Align its upper border with the down border of an obstacle

            else:  # If the object was moving down
                self.rect.top = block.rect.bottom  # Align its down border with the up border of an obstacle


class Wall(pygame.sprite.Sprite):
    def __init__(self, x, y, width, height):
        super().__init__()

        self.image = pygame.Surface([width, height])
        self.image.fill(BLUE)

        self.rect = self.image.get_rect()
        self.rect.y = y
        self.rect.x = x


pygame.init()
screen = pygame.display.set_mode([SCREEN_WIDTH, SCREEN_HEIGHT])
pygame.display.set_caption('Maze game')

all_sprite_list = pygame.sprite.Group()
wall_list = pygame.sprite.Group()

for x in range(len(walls)):
    for y in range(len(walls)):
        if walls[x][y] == 1:
            #print(x, y)
            wall = Wall(x, y, 20, 20)
            wall_list.add(wall)
            all_sprite_list.add(wall)

player = Player(maze.start[0], maze.start[1])
player.walls = wall_list
all_sprite_list.add(player)

clock = pygame.time.Clock()
done = False

while not done:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            done = True
        elif event.type == pygame.KEYDOWN:
            if event.key == pygame.K_LEFT:
                player.change_x = -3
            elif event.key == pygame.K_RIGHT:
                player.change_x = 3
            elif event.key == pygame.K_UP:
                player.change_y = -3
            elif event.key == pygame.K_DOWN:
                player.change_y = 3

        elif event.type == pygame.KEYUP:
            if event.key == pygame.K_LEFT:
                player.change_x = 0
            elif event.key == pygame.K_RIGHT:
                player.change_x = 0
            elif event.key == pygame.K_UP:
                player.change_y = 0
            elif event.key == pygame.K_DOWN:
                player.change_y = 0
    screen.fill(PINK)

    all_sprite_list.update()
    all_sprite_list.draw(screen)
    pygame.display.flip()
    clock.tick(60)

pygame.quit()

where maze.grid is a 2D np array made from 0's and 1's and maze.start is a tuple like (0, 9). When I change height and width parameters in line wall = Wall(x, y, 20, 20) to wall = Wall(x, y, 1, 1) i see a tiny maze appearing on the screen, but if i increase the height and width of a wall i just see a single square at the top left corner of the window. I assume that the problem is that i want it to add each wall on 20x20px block but instead it adds on 1x1px block. How can I fix this? Is there a way to treat coordinates not by just 1x1px block?

Answer 1

Actually, all objects are drawn, but drawn one on top of the other.

In the nested loop x and y are the index in the grid (walls), but not the coordinate of the upper left corner. You need to calculate the coordinate of the corner of each cell by multiplying it by the size of a cell (20):

wall = Wall(x, y, 20, 20)

wall = Wall(x*20, y*20, 20, 20)