Moving a Tiled map in pygame according to the play

Question

I want to be able to move the map and character of a 2D game i'm making i make the tiles by doing this:

for x in range(20):
    for y in range(20):
        pygame.draw.rect(screen, white, (x*32,y*32,32,32), 2)

and to move the map i do y += 32 but this doesn't work and the map just stays the same way. So how would i get the map to move using the code above! My question is different to the tagged question as i just want to simply move the map when the player presses W,A,S or D using the above code! I have tried to dd the tile width and height which is 32 pixels to the x and y integers but some box's weren't appearing.

Here's My full Code: Main.py

import pygame, math
from scripts.Engine import *

black = (0,0,0)
white = (255,255,255)
blue = (0,0,255)


pygame.init()

size = (600,600)
width = size[0]
height = size[1]
screen = pygame.display.set_mode((size), pygame.RESIZABLE)
face = "North"

playerN = pygame.image.load("Sprites\\Uplayer.png")
playerS = pygame.image.load("Sprites\\Dplayer.png")
playerE = pygame.image.load("Sprites\\Rplayer.png")
playerW = pygame.image.load("Sprites\\Lplayer.png")


grass = pygame.image.load("Tiles\\grass.png")

camera_x = 0
camera_y = 0
TileSize = 32
player_w, player_h = 40, 52
player_x = (width / 2 - player_w / 2 - camera_x) / TileSize
player_y = (height / 2 - player_h / 2 - camera_y) / TileSize

while True:
    screen.fill(blue)
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            pygame.quit()
            quit()
    Engine.Map(screen, 20, 20, grass, 32)
    move = pygame.key.get_pressed()
    if move[pygame.K_w]:
        face = "North"
        camera_y -= 32 # Move map This doesnt work
        player_y -= 10 # Move Sprite around map This works
    elif move[pygame.K_s]:
        camera_y += 32
        player_y += 10
        face = "South"
    elif move[pygame.K_a]:
        face = "West"
        camera_x -= 32
        player_x -= 10
    elif move[pygame.K_d]:
        face = "East"
        camera_x += 32
        player_x += 10


    if face == "North":
        screen.blit(playerN, (player_x, player_y))
    elif face == "South":
        screen.blit(playerS, (player_x, player_y))
    elif face == "East":
        screen.blit(playerE, (player_x, player_y))
    elif face == "West":
        screen.blit(playerW, (player_x, player_y))
    pygame.display.flip()

Game Engine: Tiles made here

import pygame

class Engine:

    def Map(surface, w, h, tileType,TileSize):
        global x,y
        for x in range(w):
            for y in range(h):
                surface.blit(tileType, (x*TileSize,y*TileSize))

This is my full code so far i can move the player but not the tiles themselves I don't know why

Answer 1

I figured it out but when i move up or left the map keeps generating after the map amount currently the map amount is 40 but it will keep creating tiles. But when i go down or right it shows the blue screen behind the tiles when i get to the last tile. Ill post another question on how to fix it.

Main.py:

import pygame, math
from scripts.Engine import *

black = (0,0,0)
white = (255,255,255)
blue = (0,0,255)

pygame.init()

size = (600,600)
width = size[0]
height = size[1]
screen = pygame.display.set_mode((size), pygame.RESIZABLE)
face = "North"

playerN = pygame.image.load("Sprites\\Uplayer.png")
playerS = pygame.image.load("Sprites\\Dplayer.png")
playerE = pygame.image.load("Sprites\\Rplayer.png")
playerW = pygame.image.load("Sprites\\Lplayer.png")


grass = pygame.image.load("Tiles\\grass.png")

TileSize = 32
player_w, player_h = 40, 52
player_x = (width / 2 - player_w / 2 - camera_x) / TileSize
player_y = (height / 2 - player_h / 2 - camera_y) / TileSize

mapW = camera_x
mapH = camera_y

while True:
    print(camera_x, camera_y)
    screen.fill(blue)
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            pygame.quit()
            quit()
    Engine.Map(screen, camera_x, camera_y, grass, 32, camera_x, camera_y)
    move = pygame.key.get_pressed()
    if move[pygame.K_w]:
        if camera_x > mapH:
            pass
        else:
            face = "North"
            camera_y += 1 # Move map This doesnt work
    elif move[pygame.K_s]:
        camera_y -= 1
        face = "South"
    elif move[pygame.K_a]:
        face = "West"
        if camera_x > mapW:
            pass
        else:
            camera_x += 1
    elif move[pygame.K_d]:
        face = "East"
        camera_x -= 1
        #player_x += 10


    if face == "North":
        screen.blit(playerN, (player_x, player_y))
    elif face == "South":
        screen.blit(playerS, (player_x, player_y))
    elif face == "East":
        screen.blit(playerE, (player_x, player_y))
    elif face == "West":
        screen.blit(playerW, (player_x, player_y))
    pygame.display.flip()

Game Engine.py:

import pygame

class Engine:

    def Map(surface, w, h, tileType,TileSize, camera_x, camera_y):
        for x in range(w):
            for y in range(h):
                surface.blit(tileType, (x*TileSize,y*TileSize))