時間に合わせてアニメーションさせる

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

フレームカウンターはアニメーションをフレームレートに連動させます。1秒間に30フレームしか処理できないコンピューターでは、虫の羽ばたきが半分の速さになります。代わりに時間に連動させましょう。

pygame.time.get_ticks()は、pygame.init()から経過したミリ秒数です。各画像を表示する時間で割ると、経過した画像の枚数がわかります。%を使うと、それをインデックスに変換できます。

frame_index = pygame.time.get_ticks() // 120 % len(frames)

0〜119ミリ秒では画像0、120〜239ミリ秒では画像1、その次は2、そしてまた0に戻ります。保持したりリセットしたりするカウンターは不要です。1行で、各フレームごとに計算します。ゲームの動作が遅くなると、アニメーションも一緒に遅くなるのではなく、画像を1枚飛ばします。

//は割り算をして余りを切り捨てます。250 // 120は2です。このシートの3行目には、飛んでいる虫の3つのポーズが列6〜8にあり、すでにframesに切り出されています。

チャレンジ

中級

timerとカウンターを削除します。
各フレームでpygame.time.get_ticks()からframe_indexを設定し、3枚の画像が順番にそれぞれ120ミリ秒間表示されるようにします。

自分で試してみよう

import pygame

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

sheet = pygame.image.load("assets/sheets/platformer_characters.png").convert_alpha()
frames = []
for col in (6, 7, 8):
    frame = sheet.subsurface((col * 24, 48, 24, 24))
    frames.append(pygame.transform.scale_by(frame, 3))
frame_index = 0
timer = 0

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

    timer += 1
    if timer == 10:
        timer = 0
        frame_index = (frame_index + 1) % len(frames)

    screen.fill((20, 22, 40))
    image = frames[frame_index]
    screen.blit(image, image.get_rect(center=(320, 240)))
    pygame.display.flip()
    clock.tick(60)

pygame.quit()