Menu
CoddyTech

Parallaxe

Fait partie de la section Les mondes du Journey Pygame de Coddy. Leçon 23 sur 35.

Regarde par la fenêtre d’un train en mouvement : la clôture défile rapidement et les collines au loin bougent à peine. Dessiner les objets éloignés plus lentement que les objets proches donne une impression de profondeur à un jeu en 2D. C’est ce qu’on appelle le parallaxe.

Dessine l’arrière-plan des nuages en le déplaçant d’un tiers du mouvement de la caméra. Il se répète tous les 72 pixels : seul camera_x // 3 % 72 compte. Une fois qu’il a défilé de la largeur d’une image, il a l’air identique.

shift = camera_x // 3 % 72
for y in range(0, 360, 72):
    for x in range(-shift, WIDTH, 72):
        screen.blit(background, (x, y))

La boucle x commence à -shift, à gauche de la fenêtre, pour que la première copie couvre le bord gauche pendant qu’elle en sort. Les tuiles et le joueur utilisent toujours la valeur complète de camera_x : ils sont proches.

challenge icon

Défi

Moyen
  1. Au lieu de screen.fill, dessine background (chargé dans le code de départ) sur une grille de 72 pixels.
  2. À chaque image, définis shift = camera_x // 3 % 72 et commence chaque rangée de copies à x = -shift, avec un pas de 72 jusqu’à WIDTH.
  3. Dessine les tuiles et le joueur après l’arrière-plan, comme auparavant.

Essayez vous-même

import pygame

TILE = 36
WIDTH = 576
SPEED = 4
GRAVITY = 1
JUMP = -15
MAX_FALL = 12

LEVEL = [
    "................................................",
    "................................................",
    "#...........###..........####..........###.....#",
    "#..............................................#",
    "#.....####.........###.........###.............#",
    "#..............................................#",
    "#.P........#####.........######.........####...#",
    "#..............................................#",
    "#..............................................#",
    "################################################",
]

pygame.init()
screen = pygame.display.set_mode((WIDTH, 360))
pygame.display.set_caption("Parallax")
clock = pygame.time.Clock()

background = pygame.image.load("assets/backgrounds/clouds.png").convert_alpha()
block_img = pygame.image.load("assets/images/block.png").convert_alpha()
player_img = pygame.image.load("assets/images/player.png").convert_alpha()

walls = []
for row, line in enumerate(LEVEL):
    for col, char in enumerate(line):
        if char == "#":
            walls.append(pygame.Rect(col * TILE, row * TILE, TILE, TILE))
        elif char == "P":
            start = (col * TILE + TILE // 2, row * TILE + TILE)

level_width = len(LEVEL[0]) * TILE
player = player_img.get_rect(midbottom=start)
vel_y = 0
on_ground = False
camera_x = 0

running = True
while running:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            running = False
        elif event.type == pygame.KEYDOWN and event.key in (pygame.K_SPACE, pygame.K_UP):
            if on_ground:
                vel_y = JUMP
        elif event.type == pygame.KEYUP and event.key in (pygame.K_SPACE, pygame.K_UP):
            if vel_y < -4:
                vel_y = -4

    keys = pygame.key.get_pressed()
    dx = 0
    if keys[pygame.K_LEFT]:
        dx -= SPEED
    if keys[pygame.K_RIGHT]:
        dx += SPEED

    player.x += dx
    for wall in walls:
        if player.colliderect(wall):
            if dx > 0:
                player.right = wall.left
            elif dx < 0:
                player.left = wall.right

    vel_y = min(vel_y + GRAVITY, MAX_FALL)
    player.y += vel_y
    on_ground = False
    for wall in walls:
        if player.colliderect(wall):
            if vel_y > 0:
                player.bottom = wall.top
                on_ground = True
            elif vel_y < 0:
                player.top = wall.bottom
            vel_y = 0

    camera_x = player.centerx - WIDTH // 2
    camera_x = max(0, min(camera_x, level_width - WIDTH))

    screen.fill((140, 200, 240))
    for wall in walls:
        screen.blit(block_img, (wall.x - camera_x, wall.y))
    screen.blit(player_img, (player.x - camera_x, player.y))
    pygame.display.flip()
    clock.tick(60)

pygame.quit()

Toutes les leçons de Les mondes

Entraînez-vous par vous-même : Playground Pygame