ゲームライブラリ構築までの道 #1「ブロック崩し編」

Pocket
LINEで送る
GREE にシェア
LinkedIn にシェア

こんにちわ。
 

やっぱりゲームを作るのは楽しいな〜と、つぶやいている、下駄です。
 

gameを構築するイメージがまあまあ見えてきたんですが、少し規模の大きいgameを作る時に、
 

フレームワークを使ってgameを作ってもいいんですが、できるだけ無駄とブラックボックス箇所を無くしたいので、
 

フルスクラッチでcanvasを使って構築をしたいと思った時に、いろいろなライブラリが必要になる事もイメージできます。
 

そんなライブラリを作り込んで行きたいと思って、小さなゲームプログラムを作り重ねていき、最終的に自分ライブラリを作ってみたいと思います。
 

ブログでは、そんなプログラムの解説をしつつ、Githubで都度のバージョンを公開して行く予定です。

本日のIT謎掛け

「ゲームライブラリ」と、かけまして、
 

「公園の遊具」と、ときます。
 

そのココロは・・・
 

遊ぶ時に、無いとまあまあ困るもの。

本日の目的

以前に作った三目並べのcanvasライブラリを参照しつつ、データ管理や、表示まわりの効率的な書き方などがまとまっていないので、とりあえず、今回はまだ手を付けていなかった、アニメーションに関するかんたんなライブラリを作ってみたいと思います。
 

そこで、BASICを学習した時の一番最初に作った「壁打ちテニス」にTRYします。
 

仕様は、三方壁に囲まれたbox内で直線的に動くボールを、手前のラケット(棒)で、返すだけですが、以下のような処理が必要になります。
 

・基本描画処理
・開始時の「start」ボタンのクリックイベント処理
・ボールと、ラケットが動くアニメーション描画処理(全体書き換え)
・マウス動作によるラケット移動
・ボールが壁に当たって跳ね返る当たり判定
・ボールがラケットに当たって跳ね返るコリジョン処理
・ボールが画面外に言ってしまった時のGameOver処理

 

これを簡易仕様として、構築していきます。
 

基本描画処理

まず始めに、基本の画面表示をしてみます。
 

画面サイズを決めて、3方の壁の表示です。
 

初期構築という事で、htmlも含めたソースコードも合わせて掲載しておきます。

ソースコード

 

 

Github

https://github.com/yugeta/game_block
 

今回は初期表示のみのバージョンなので、あまり面白くないですが、今後バージョンアップさせていく予定なので、楽しんでもらえる方は引き続き読んでくださいませ。

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です