Menu
CoddyTech

إزاحة الكاميرا

جزء من قسم العوالم في رحلة Pygame على Coddy. الدرس 20 من 35.

يبلغ عرض هذا المستوى 48 بلاطة، أي ثلاثة نوافذ. يحتفظ كل شيء بموضعه في المستوى، وتحدد الكاميرا أي جزء من المستوى تعرضه النافذة. الكاميرا رقم واحد، camera_x: إحداثي x في المستوى عند الحافة اليسرى للنافذة.

لرسم شيء ما، اطرح الكاميرا من إحداثي x الخاص به في المستوى:

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

عندما تكون قيمة camera_x = 0، ترى البداية. وعندما تكون قيمة camera_x = 600، يُرسم جدار عند x = 800 في الموضع 200. يتغير الرسم فقط: تحتفظ مستطيلات walls وplayer بمواضعها في المستوى، لذا تعمل التصادمات كما كانت من قبل.

في هذا البرنامج، تتحرك الكاميرا تلقائيًا نحو اليمين بمقدار 2 بكسل في كل إطار، حتى تعرض نهاية المستوى. يغيّر البرنامج الابتدائي قيمة camera_x، لكنه يرسم من دون استخدامها، لذا لا يتحرك شيء.

challenge icon

التحدي

سهل
  1. ارسم كل جدار عند (wall.x - camera_x, wall.y).
  2. ارسم اللاعب عند (player.x - camera_x, player.y).

اترك الانجراف كما هو: ينبغي أن يتحرك المستوى إلى اليسار تلقائيًا.

جرّب بنفسك

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()
quiz iconاختبر نفسك

يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.

جميع دروس العوالم

تدرّب بنفسك: Playground لـ Pygame