Độ lệch của camera

Thuộc phần Thế giới trò chơi trong hành trình Pygame của Coddy. Bài học 20 trên 36.

Màn này rộng 48 ô gạch, tương đương ba cửa sổ. Mọi thứ giữ nguyên vị trí trong màn, còn camera quyết định cửa sổ hiển thị phần nào của màn. Camera là một con số, camera_x: tọa độ x trong màn tại mép trái cửa sổ.

Để vẽ một vật, hãy trừ tọa độ camera khỏi tọa độ x của vật trong màn:

for wall in walls:
    screen.blit(block_img, (wall.x - camera_x, wall.y))
screen.blit(player_img, (player.x - camera_x, player.y))

Khi camera_x = 0, bạn sẽ thấy điểm bắt đầu. Khi camera_x = 600, bức tường ở x = 800 sẽ được vẽ tại vị trí 200. Chỉ có việc vẽ thay đổi: các Rect trong walls và player vẫn giữ nguyên vị trí trong màn, nên va chạm vẫn hoạt động như trước.

Trong chương trình này, camera tự trôi sang phải với tốc độ 2 pixel mỗi khung hình, cho đến khi hiển thị phần cuối màn. Mã khởi đầu di chuyển camera_x nhưng lại vẽ mà không dùng nó, nên không có gì di chuyển.

Thử thách

Dễ

Vẽ màn chơi qua camera.

Vẽ từng bức tường tại (wall.x - camera_x, wall.y).
Vẽ nhân vật tại (player.x - camera_x, player.y).
Giữ nguyên dòng khiến camera_x tự dịch chuyển.

Nhấn Chơi: màn chơi tự trượt sang trái. Sau đó, nhấn Kiểm tra.

Tự làm thử

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("Camera")
clock = pygame.time.Clock()

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

    if camera_x < level_width - WIDTH:
        camera_x += 2

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

pygame.quit()