透過ピクセル

CoddyのPygameジャーニー「スプライトと画像」セクションの一部。レッスン 5/36。

画像ファイルは常に長方形ですが、敵の宇宙船はそうではありません。その周囲のピクセルは透明です。PNGの各ピクセルには4つ目の数値であるアルファ値があり、0（完全に透明）から255（不透明）までの値を取ります。

スターターでは、convert()を使って3体の敵を読み込んでいますが、これはアルファ値を破棄します。そのため、透明なピクセルはすべて黒になり、各敵は黒い四角の中に表示されます。convert_alpha()はアルファ値を保持するため、不透明なピクセルだけがウィンドウを覆います。塗りつぶされた長方形ではないものには、これを使いましょう。

Rectは依然として長方形全体を表します。輪郭を描いて、画像が占める範囲を確認しましょう。

rect = red.get_rect(topleft=(128, 200))
screen.blit(red, rect)
pygame.draw.rect(screen, (90, 90, 120), rect, 1)

最後の数値1は、Rectを塗りつぶす代わりに、幅1ピクセルの輪郭を描きます。輪郭と宇宙船の間の隙間を見てください。画像同士が触れていなくても、2つのRectは重なることがあり、Rectによる衝突判定では衝突したと判定されます。第5章でこの問題を解決します。

チャレンジ

簡単

黒い四角がなくなるように、3つの敵を.convert()ではなく.convert_alpha()で読み込みます。
各敵の後ろに、そのRectの輪郭を(90, 90, 120)で描画します。幅は1ピクセルです。敵の位置は(128, 200)、(288, 200)、(448, 200)のままです。

自分で試してみよう

import pygame

pygame.init()
screen = pygame.display.set_mode((640, 480))
pygame.display.set_caption("Three Enemies")
clock = pygame.time.Clock()

red = pygame.image.load("assets/images/enemy_red.png").convert()
green = pygame.image.load("assets/images/enemy_green.png").convert()
yellow = pygame.image.load("assets/images/enemy_yellow.png").convert()

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

    screen.fill((20, 22, 40))
    screen.blit(red, (128, 200))
    screen.blit(green, (288, 200))
    screen.blit(yellow, (448, 200))
    pygame.display.flip()
    clock.tick(60)

pygame.quit()