Menu
CoddyTech

Hình ảnh ô 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 6 trên 36.

Các hình chữ nhật màu nâu cho biết vị trí các bức tường. Hình ảnh giúp màn chơi trông giống một địa điểm hơn. Tải mỗi hình ảnh ô bản đồ một lần, sau set_mode:

block_img = pygame.image.load("assets/images/block.png").convert_alpha()
coin_img = pygame.image.load("assets/images/coin.png").convert_alpha()

Mỗi ô có kích thước 36 x 36, bằng kích thước một ô bản đồ, nên vừa khít với lưới mà không cần đổi kích thước. Hình đồng xu có viền trống, nên hãy vẽ nó ở góc ô để đồng xu nằm chính giữa.

Gom những gì cần vẽ vào một danh sách các cặp: hình ảnh nào và ở đâu. tiles.append((block_img, rect)) thêm một cặp; vòng lặp của trò chơi sẽ vẽ tất cả các cặp đó:

for image, rect in tiles:
    screen.blit(image, rect)

Vòng lặp tách mỗi cặp thành image và rect.

challenge icon

Thử thách

Dễ

Vẽ màn chơi bằng hình ảnh thay vì hình chữ nhật.

  1. Sau set_mode, tải assets/images/block.png vào block_img và assets/images/coin.png vào coin_img, bằng convert_alpha().
  2. Tạo danh sách tiles: với mỗi #, dùng (block_img, pygame.Rect(col * TILE, row * TILE, TILE, TILE)); với mỗi C, dùng (coin_img, ...) cùng Rect.
  3. Vẽ từng cặp trong tiles thay cho các hình chữ nhật.

Nhấn Chơi: các khối và đồng xu sẽ thay thế những mảng màu đơn sắc. Sau đó nhấn Kiểm tra.

Tự làm thử

import pygame

TILE = 36
WALL = (120, 90, 60)
COIN = (255, 196, 0)

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

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

walls = []
coins = []
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 == "C":
            coins.append(pygame.Rect(col * TILE + 10, row * TILE + 10, 16, 16))

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

    screen.fill((140, 200, 240))
    for wall in walls:
        pygame.draw.rect(screen, WALL, wall)
    for coin in coins:
        pygame.draw.rect(screen, COIN, coin)
    pygame.display.flip()
    clock.tick(60)

pygame.quit()

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

Tự luyện tập: Playground Pygame