>> シューティングゲーム作成入門トップに戻る

背景をスクロールしよう

前回までの講座で背景を描画するとこまで説明しました。
でも良く見かけるシューティングゲームの背景ってスクロールしてますよね?
あれを表現してみようと思います。
仕組み的には、背景画像の座標を一定時間ごとにずらしながら、
何枚も後ろから続けて描画すれば表現できます。
コードでは以下のようになります。

void BACK::Draw()
{
	
	//1枚目描画
	DrawGraph(x,y,gh,FALSE);

	//二枚目描画
	DrawGraph(x,y-460,gh,FALSE);

	//一番下までスクロールしたら初期値に戻す
	if(y==460+MARGIN)
		y=10;


}

void BACK::Move()
{
	y+=SCROLL_SPEED;
}


void BACK::All()
{
	Draw();
	Move();
}


これを実行すると以下の動画のようにスクロールさせることができます。


コード量はそんなに増えてません。
まず、Move関数を作って、y座標を毎ループごとに一定量ずつプラスするようにしています。
SCROLL_SPEEDという定数はdefine.hで以下のように定義しています。

//背景スクロールスピード
#define SCROLL_SPEED 2


今は2に設定しているので、毎ループごとに2ずつ下に移動することになります。
次に、Draw関数を見てください。
1枚目描画と書いてある部分は、特に変更はありません。
座標はずれていくので自然とスクロールされます。

次に、スクロールされると上にスペースができるので、その部分に二枚目の背景をくっつけて描画してやります。
その部分のコードが「二枚目描画」と書いてある部分のコードです。
Y座標の指定方法だけ1枚目と違います。
画像の縦幅は460ピクセルなので、y座標から460引いています。
すると丁度画像一つ分上の位置の座標を指定したことになるので、
1枚目の上にくっついて描画できることになります。

スクロールは永遠に続くので、下までスクロールしたら値を初期値に戻してやります。
こうすることで、永遠にスクロールさせることができます。
一番下までスクロールしたときのy座標は、画像の縦幅+余白の座標になるので、
460+MARGINの座標になった時に、Y座標を初期値の10に戻してます。
これでまた値がリセットされるので、最初のスクロール位置にもどって描画できることになります。

以下の動画のように背景をスクロールさせることができます。

今回の説明は以上です。
次回は操作キャラから弾を発射してみましょう。

>> 【操作キャラから弾を発射してみよう】に進む
>> シューティングゲーム作成入門トップに戻る