Menu
CoddyTech

Nền lát ô gạch

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

Một màu đơn phía sau màn chơi trông trống trải. assets/backgrounds/clouds.png là hình ảnh 72 x 72 được thiết kế để lặp lại: cạnh trái khớp với cạnh phải, cạnh trên khớp với cạnh dưới. Hãy vẽ ảnh theo dạng lưới phủ kín cửa sổ:

for y in range(0, 360, 72):
    for x in range(0, 576, 72):
        screen.blit(background, (x, y))

range(0, 576, 72) tạo ra các giá trị 0, 72, 144 và tiếp tục như vậy đến 504, vị trí bắt đầu cuối cùng vẫn hiển thị được. 576 là bội số của 72, nên bản sao cuối cùng kết thúc ngay mép cửa sổ. Ảnh nền thay thế screen.fill: nó phủ kín mọi pixel.

Thứ tự rất quan trọng. Nội dung bạn vẽ sau sẽ che nội dung bên dưới, vì vậy hãy vẽ ảnh nền trước, rồi vẽ các ô lên trên.

challenge icon

Thử thách

Dễ

Lấp đầy bầu trời bằng hình nền mây lặp lại.

  1. Thay vì dùng screen.fill, hãy blit background (đã được tải trong phần code khởi đầu) tại mỗi giá trị x từ 0 đến 576 và mỗi giá trị y từ 0 đến 360, với bước tăng 72.
  2. Vẽ các ô sau hình nền.

Nhấn Chơi: mây lấp đầy cửa sổ phía sau màn chơi. Sau đó nhấn Kiểm tra.

Tự làm thử

import pygame

TILE = 36

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

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

grass_img = pygame.image.load("assets/images/grass.png").convert_alpha()
grass_left_img = pygame.image.load("assets/images/grass_left.png").convert_alpha()
grass_right_img = pygame.image.load("assets/images/grass_right.png").convert_alpha()
dirt_img = pygame.image.load("assets/images/dirt.png").convert_alpha()
coin_img = pygame.image.load("assets/images/coin.png").convert_alpha()
background = pygame.image.load("assets/backgrounds/clouds.png").convert_alpha()


def solid(row, col):
    if row < 0 or row >= len(LEVEL) or col < 0 or col >= len(LEVEL[0]):
        return False
    return LEVEL[row][col] == "#"


tiles = []
for row, line in enumerate(LEVEL):
    for col, char in enumerate(line):
        x, y = col * TILE, row * TILE
        if char == "#":
            if solid(row - 1, col):
                image = dirt_img
            elif not solid(row, col - 1) and solid(row, col + 1):
                image = grass_left_img
            elif solid(row, col - 1) and not solid(row, col + 1):
                image = grass_right_img
            else:
                image = grass_img
            tiles.append((image, pygame.Rect(x, y, TILE, TILE)))
        elif char == "C":
            tiles.append((coin_img, pygame.Rect(x, y, TILE, TILE)))

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

    screen.fill((140, 200, 240))
    for image, rect in tiles:
        screen.blit(image, rect)
    pygame.display.flip()
    clock.tick(60)

pygame.quit()
quiz iconTự kiểm tra

Bài học này có một bài trắc nghiệm ngắn. Bắt đầu bài học để trả lời và theo dõi tiến độ.

Tất cả bài học trong Thế giới trò chơi

Tự luyện tập: Playground Pygame