AREA 021
Featuring AlphaScript

LEVEL 2 歩き出したひよこ

 

最初のステップで作ってしまった「滑るひよこ」を、ちゃんと「歩くひよこ」に修正します。  ついでに、「時間」や「速さ」をもっとわかりやすくしてみます。


滑っている理由

まず、なぜひよこが滑っているように見えてしまうのかですが、これは考えるほどのことではないですね。  「歩く」という動きのパターンを見せたいのですから、複数の画像でアニメーションさせればよいのです。  画像の枚数が多ければ多いほど滑らかな動きを表現できますが、それっぽく見せるだけなら2枚あれば充分です。  ということで、枚数は2枚に決定。(手抜き!?)

素材集には hiyoko2.gif という、もうひとつのひよこの画像がありますので、これを使います。  ただ、ぱっと見ただけだと2枚ともあまり変わらない感じがするかもしれませんね。  なにしろ、人間と違ってこのひよこは足の部分が極端に小さいですから。。  そのことを考え、2枚目の画像は1枚目と比べ、1ピクセル縦方向にずらしています。  つまり、ちょっとだけ上下に揺れたようになるのです。 これだけでかなり歩いてるっぽく見えます。


時間と速さ

ひよこをアニメーションさせるわけですが、 処理としては「2枚の画像を交互に切り替える」という作業です。  ということは、2枚の画像を切り替える間隔を決める必要があります。  例えば、1秒に1回ならかなりのんびり歩いている感じになりますし、 毎フレーム切り替えればものすごく忙しいひよこになります。 (どっちかって言うと「震えるひよこ」になるかな?)

これを決めるのには、 time 関数を使います。  time 関数は、指定した時間が何コマなのかを教えてくれます。  秒間50フレームなら1秒が50コマですが、これをいちいち考えるのは面倒ですし、 直接「50」などと書いてしまうと、後でフレーム数を変えたいときにいちいち修正しなければなりません。

もう1つ、ひよこの歩く速さも、speed 関数で指定するようにします。  speed 関数 は、1番目の引数で指定した秒数の間に、2番目の引数の幅を移動する「速さ」を教えてくれます。  ここでは、1秒に80ピクセルという速さにしました。


まだ問題が・・・

しかし、まだ問題が残されています。--;  それは、ひよこが右に向かって歩いているときも画像は左向きのまま、という点です。  そこで、ひよこの画像を左右反転した画像をスクリプト内で生成し、 右方向に動いている時は、そちらの画像を表示するようにします。 

もちろん、あらかじめ反転しておいた画像を作って読み込んでも良いのですが、 それだと絵を修正するときに面倒ですし、そのためにあるような機能を使わないのは芸が無いです。


次の課題

スクリプトはこちら、 結果はこちらです。  おお、ちゃんと歩いてます!  だんだんゲームに近づいていくような予感。

でも、これじゃただ見てるだけの「アニメーション」ですね。  やっぱり、動かせなければ意味がありません。  次は、ひよこを操作できるようにします。

 

ページ一覧に戻る  次のレベルへ!

Copyright (c) Rabit 2005-2012 all rights reserved.