How to move the player across a one background image?

Question

Apologies for asking so many questions recently. I'm just starting to get into pygame. With my previous questions I don't think I've been wording it properly for what I am trying to do.

Here is a quick picture I did to try demonstrate

This is a single background image or map that I would like the player to move across. The red X is just a starting place for the character. I'm try to make it so when I move the player the background will also follow as if the player is moving through the map. I've already limited the player from not being able to go off the borders of the actual screen. Just having a bit of trouble now trying to make it so the single image will move along the player and if the player reaches the end of the map picture movement stops. I have seen people use scrolling and duplicating the image when the player moves. I just want to see it to the single image that the player will move across. I don't want to worry about collisions just be able to get the movement working.

This is the code I am currently using:

from pygame.locals import *
from math import sin

pygame.display.set_caption("TEST")

clock = pygame.time.Clock()
time_passed = 0
class Player():
  def __init__(self,x,y):
    self.Image = pygame.image.load("myAvatar.png").convert()

    self.x = 200
   
    self.y = 200
  

  def getX(self):
    return self.rect.x

  def getY(self):
    return self.rect.y

  def handle_keys(self,screenHeight,screenWidth):
      key = pygame.key.get_pressed()
      dist = 2 

      if key[K_LEFT] and self.x > 0: 
            self.x -= 500 * time_passed
      
      if key[K_RIGHT] and self.x < screenWidth -20:
            self.x += 500 * time_passed
         
      if key[K_UP] and self.y > 0:
        self.y -= 500 * time_passed
      
      if key[K_DOWN] and self.y < screenHeight -20:
        self.y += 500 * time_passed
    


  def draw(self, game_window):
    self.Image = pygame.transform.scale(self.Image,(20,20))
    
    game_window.blit(self.Image, (int(self.x), int(self.y)))
   



class Map():
  def __init__(self):
    self.Image = pygame.image.load("test2.png").convert()




    self.rect = self.Image.get_rect()
    self.x = 0
    self.y = 0


  def draw(self, game_window,screenHeight,screenWidth):

    self.x = min(max(self.x, player.x - 2  * screenWidth / 2), player.x - screenWidth / 2)
    self.y = min(max(self.y, player.y -2  * screenHeight / 2), player.y - screenHeight / 2)



    game_window.blit(self.Image,(-self.x,-self.y))
  


class Enemy():
  def __init__ (self,x,y):
    self.Image = pygame.image.load("WC.jpg").convert()


    self.rect  = self.Image.get_rect(topleft = (x,y))


  
  def draw(self, game_window):
    self.Image = pygame.transform.scale(self.Image,(20,20))
    game_window.blit(self.Image, (self.rect.x, self.rect.y))


pygame.init()

clock = pygame.time.Clock()
screenWidth = 400
screenHeight = 400
game_window = pygame.display.set_mode((screenWidth,screenHeight))
player = Player(200,200)
map = Map()
enemy = Enemy(250,250)
leave = False
while not leave:
  for event in pygame.event.get():
    if event.type == pygame.QUIT:
      pygame.quit() 
      running = False



  player.handle_keys(screenHeight,screenWidth)

  game_window.fill((0,0,0))
  map.draw(game_window,screenHeight,screenWidth)
  #enemy.draw(game_window)
  player.draw(game_window)
 
  pygame.display.update()
  pygame.display.flip()
  time_passed = clock.tick() / 1000

  


pygame.quit()
quit()

Thanks Shay

Answer 1

The player's movement depends on the size of the map. The x and y attributes of the "player" store the position on the map and are limited to the size of the map ( map_size ). The player is always drawn in the center of the screen, except it is near the boarders of the map:

class Player():
    def __init__(self, x, y):
        self.Image = pygame.image.load("myAvatar.png").convert()
        self.x = 200
        self.y = 200
  
    def handle_keys(self, map_size):
        key = pygame.key.get_pressed()
        self.x += (key[K_RIGHT] - key[K_LEFT]) * 500 * time_passed
        self.y += (key[K_DOWN] - key[K_UP]) * 500 * time_passed
        self.x = max(0, min(map_size[0]-20, self.x))
        self.y = max(0, min(map_size[1]-20, self.y))
    
    def draw(self, game_window, map_size):
        window_size = game_window.get_size()
        center = window_size[0] // 2, window_size[0] // 2
        
        pos = [self.x, self.y]
        for i in range(2):
            if center[i] < pos[i] <= map_size[i]-center[i]:
                pos[i] = center[i]
            elif pos[i] > map_size[i] - center[i]: 
                pos[i] = window_size[i] - map_size[i] + pos[i]
        game_window.blit(self.Image, (int(pos[0]), int(pos[1])))

The player's position on the map is centered in the window:

class Map():
    def __init__(self):
        self.Image = pygame.image.load("test2.png").convert()

    def draw(self, game_window):
        window_size = game_window.get_size()
        map_size = self.Image.get_size()
        x = max(0, min(map_size[0] - window_size[0], player.x - 200))
        y = max(0, min(map_size[1] - window_size[1], player.y - 200))
        game_window.blit(self.Image, (-x, -y))

Application loop:

leave = False
while not leave:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            leave = True

    player.handle_keys(map.Image.get_size())

    game_window.fill((0,0,0))
    map.draw(game_window)
    #enemy.draw(game_window)
    player.draw(game_window, map.Image.get_size())
    
    pygame.display.update()
    pygame.display.flip()
    time_passed = clock.tick() / 1000

pygame.quit()