ゲーム制作5日目！×5

#今日のメニュー

・外壁設置

#壁
壁を描いて、衝突判定するところまでやります。
壁はSurfaceというクラスを使って書いてみようと思います。
参考:Surface を使ってCanvas描画してみよう

surfaceではキャンバスを作って、そこに長方形などを書けるようです。
このsurfaceで作成したものは、画像として、
Spriteに登録することができます。
とりあえず今回は厚さ16pxの壁を四面に設置します。

ソースコードは以下の感じ。
壁は配列を使用することにしました。
位置についてはベタ書きをしているので、
あまり頭が良くないような気がします。

			//水平の壁
			var wallHolSurface=new Surface(WIDTH,16);
			wallHolSurface.context.fillStyle="black";
			wallHolSurface.context.fillRect(0,0,WIDTH,16);
			
			//垂直の壁
			var wallVerSurface=new Surface(16,HEIGHT);
			wallVerSurface.context.fillStyle="black";
			wallVerSurface.context.fillRect(0,0,16,HEIGHT);
			
			var wall=[new Sprite(WIDTH,16),new Sprite(16,HEIGHT),new Sprite(WIDTH,16),new Sprite(16,HEIGHT)];
			//surfaceをセット
			for(var i=0;i<4;i++){
				if(i%2==0){
					wall[i].image=wallHolSurface;
				}else{
					wall[i].image=wallVerSurface;
				}
				scene.addChild(wall[i]);
			}

			//位置
			wall[0].x=0;
			wall[0].y=0;

			wall[1].x=WIDTH-16;
			wall[1].y=0;

			wall[2].x=0;
			wall[2].y=HEIGHT-16;

			wall[3].x=0;
			wall[3].y=0;

#衝突判定
壁の衝突判定にはintersect関数を使用します。
これは、壁は長方形の形であるため、
中心点との座標を測るwithin関数では、
正しい判定を行うことができないからです。

貼るほどではないかもしれませんが、衝突判定部分は以下の感じ。

						//壁
						for(var i=0;i<4;i++){
							if(this.intersect(wall[i])){
								game.replaceScene(createGameOverScene());
							}
						}

#今日の成果

今日の成果に飛びます。
全面青画面がスタート画面です。
画面をクリックすると、ゲームがスタートします。
ゲーム中では左右キーで曲がることができます。
とまることはできません。
下ボタンで増殖します。
自分の体および壁に衝突すると、全面緑色のゲームオーバー画面に飛びます。
ゲームオーバー画面で画面をクリックするとスタート画面に戻ります。

#問題点

どこか計算式が間違っているようで、
曲がっていると体がだんだんずれていく気がします。
どうにかしないと…。