Hello World / plɹoM ollǝH

Programmers Live in Vain

Pythonゲームプログラミング #3 アニメーション

gist消してしまったので
代わりにこのリポジトリを参考にしてください

#0 環境構築
#1 メインループ
#2 画像表示
#3 アニメーション
#4 キー入力
#5 サウンド
#6 衝突判定
#7 ステートマシン
#8 マップチップ
#9 スクロール

アニメーション

pygameを使ったゲームプログラミングについて説明していきます。

  • Windows10
  • Python3.6.1
  • pygame1.9.3

今回は画像をアニメーションさせてみます。

アニメーションの仕組み

アニメーションは、パラパラ漫画のように異なる画像を少しずつ表示することによって、絵が動いているように見せています。

f:id:dungeonneko:20170512112422p:plain

ゲームでは、歩きアニメーションなどの繰り返しがあるものと、爆発のように繰り返しのないものがあります。

f:id:dungeonneko:20170512112442p:plain

画像の大きさや並びに法則性を持たせておけば、複雑なクラスを作成しなくても、簡単にアニメーションをおこなうことができます。

サンプルコード

今回はこのような画像を用意してみました。

f:id:dungeonneko:20170512101826p:plain

実行結果

f:id:dungeonneko:20170512104306g:plain

解説

表示する画像の座標指定

今回はキャラクターの画像を32ピクセルごとに横に並べているので、変数が1つあればパターンを切り替えることができます。

f:id:dungeonneko:20170512105222p:plain

例えば左から3番目の画像を表示したい場合は下記のように書きます。

i = 2  # n番目 - 1
screen.blit(img_char, (0, 0), (32 * i, 0, 32, 32))

フレームカウント

10行目と35行目

frame = 0  # フレーム
frame += 1

アニメーションをおこなうには今何フレーム目なのかをカウントしておく必要があります。メインループの最後でフレーム数をインクリメントします。

ループあり

24行目

loop_anim_index = int(frame / 3) % 5

フレームごとに変数を 0, 1, 2, 0, 1, 2 ... と変化させたい場合は「フレーム÷変化の長さ」の余剰を求めます。

x = frame % 3  # 0, 1, 2 を繰り返す

アニメーションの速度が速すぎる場合は、フレーム数を割って調整します。

x = int(frame / 2) % 3  # 2フレームごとに切り替わる

ループなし

28行目

anim_index = min(int(frame / 15), 5)

アニメーションをループさせたくない場合はmin関数などを使って、指定した数より大きくならないようにしておきます。