enchant.js100行未満!!本格シューティングゲーム作り方。

公開 : → 更新 :

昨日歩き回ったせいで、足がかなり痛い@It_is_Rです。

さて、今回はenchant.jsのネタです。enchant.jsを使うと、javascriptのプログラムがものすごく簡単に書けてしまいます。
ならば、enchant.jsを使えば100行未満のシューティングゲームの開発が可能なのでしょうか?

今回はenchant.jsでのたった100行未満の、本格シューティングゲーム開発に挑戦してみました。

では、今回の目標を発表します。

  • プログラムは100行以内。
  • 行数を縮めるために、無理やり1行にしたりはなるべくしない。
  • 背景は表示する。スクロールもさせる。
  • 敵はまっすぐ下に弾を撃つ。自機ももちろん弾を撃てる
  • スコアも表示させる。

こんな感じで作ってみようと思います。
では、まずは実際に作ってみたゲームをごらんください。
9leapにアップロードしてみました。

ソースはこちらです。

大まかに見ていきましょう。

9〜15行目で、背景(空)の画像を2枚表示しています。2枚表示するのは、背景をスクロールさせるためです。
行数を省略するため、for文を使いました。
22〜25行目で、背景(空)の画像をスクロールさせています。
26〜30行目で、敵を40フレームごとに出現させています。
32〜38行目は、ゲームオーバーシーンを作っています。このシーンを読み込むことで、ゲームオーバー画面を作ることができます。

クラスとして、Player、Enemy、Shotのクラスを作成しています。
今回は行数を減らすため、Shotクラスを、自機、敵機の2つから同じものを利用しています。

その為に、Shotクラスに弾を出す機体を判別する為の引数を加えました。

スポンサードリンク

コメントをどうぞ!

メールアドレスが公開されることはありません。




オススメ記事

enchant.jsのロード画面を、好きな画像に変更する方法。

今日は爆睡していました。@It_is_Rです。 enchant.jsのロード画面はカッコわるいなとずっと思っていました。「あ、これenchant.jsで作ったんだな」って思われてしまうじゃないで

zplug を使ってプラグインをインストール、管理する。

二つのことを同時にできない、@It_is_Rです。 今回はターミナルをかっこよくするシリーズ、第三回目です。 zplug を使って、プラグインをインストールする方法を紹介します。

java

Javaのクラスとメソッドの違いとは?ゲーム風に解説。

この頃小説を読んでいなく、何か読みたいなと思っている@It_is_Rです。 Javaを勉強し始めたばかりの人は、何やら難しい単語に混乱する人も多いでしょう。その中で、クラスとメソッドって一体何が

gulp

gulpでsassをcssにコンパイル。インストール&便利な使い方。

幸せそうな人を見ると、転べって思います。@It_is_Rです。 Webページを制作するとき、sassをcssに変換して使用することが多いと思います。 今回は、gulpを使ってsassをcssに

【Android Studio】新規プロジェクトを作成する方法。

インスタント焼きそばを作ろうとすると、なぜか焼うどんになります。 @It_is_R です。 しかも、ラーメン作ろうと思うと焼きそばができあがります。 前回、 Android Studio のイ

JavaScriptマンガ講座。条件分岐(if文)の真偽値による使い方。(実践編)

生まれも育ちもド田舎、@It_is_Rです。 JavaScriptマンガ講座、第3回目です。 笑いあり、涙あり(?)のマンガで、JavaScriptを覚えようというものです。 今回は条件

Ameba customize

アメーバのOwndで、無料で超簡単にホームページ作ってやろうぜ!!

どうも、@It_is_Rです。 ホームページを作成するには、まずHTMLを使う能力、若しくはソフトが必要になります。 さらにサーバーを借りなくてはなりません。するとお金がかかったりします。 では

VCCW

VCCW で、超簡単に WordPress のローカル開発環境を整える方法。

考えすぎて間違った方向へ進む、@It_is_Rです。 WordPress のローカル開発環境を作りたい時、 VCCW を使うと便利です。 今回は、 その方法を紹介します。 VCC

KSSでスタイルガイドを作る方法。インストールと使い方。

そのうちWordPressのテーマを作る方法の解説とかしたいなーと思っている@It_is_Rです。 いま準備中ですので、もうちょっとお待ちくださいねー。 そして今回ですが、KSSを使ったスタイ

FC2 blog customize

FC2ブログ ”最強” カスタマイズ入門講座。文字の大きさを設定する。

こんにちわ。美しいものほど濁って見える@It_is_Rです。 今回もFC2ブログの"最強"カスタマイズを始めていこうと思います。 今回は文字の大きさや色など、ブログ内の文字の設定をしていきます