主人公に歩行アニメーションを追加する
主人公が上下左右に動いても正面を向いたままだったので、移動方向に合わせて主人公の見た目が変わるプログラムを追加しました。 前作でも導入していましたが、歩行用のプログラムが少し違ったので若干苦労しました。内容自体はシンプルで、元々"var imgplayer = document.getElementById("imgBoy");"という一つの画像しか描写しないようになっていた為、if文を使って"this.dir == -1"の時は"imgBoy_Left"を表示、即ち左に進んだときは左向きの画像を表示しています。 改良前: 改良後: ゲームの完成度という点ではなくてはならない要素だと思うので無事追加できて内心ホッとしています。時間があれば、コマ送りに主人公が歩いているように見えるようにしたいとも考えています。しかし、そうなると今回改良したプログラムをまた改良しないといけなそうなので二の足を踏んでしまっています。しばらくはトライしてみますが、期限も迫っているので完成させることを常に念頭に置きつつ進めてまいります。 という訳で今回は以上となります。お疲れさまでした。 参考文献 田中賢一郎『ゲームで学ぶ JavaScript 入門』インプレス, 2015年 田中賢一郎『ゲームを作りながら楽しく学べる HTML5+CSS+JavaScript』インプレス, 2017年 田中賢一郎『ゲームで学ぶ JavaScript 入門 増補改訂版〜ブラウザゲームづくりでHTML&CSSも身につく!』インプレス, 2022 年 素材: ぴぽや倉庫 https://pipoya.net/sozai/ ドット絵世界 https://yms.main.jp/