C言語 入門 STGの作り方

三日目 簡単な背景

初心者向けSTG作成入門

HOME/STGの作り方 目次/三日目 簡単な背景/

広告

↓2016年02月29日発売↓

12歳からはじめる ゼロからのC言語 ゲームプログラミング教室

新品価格
¥2,462から
(2016/5/10 22:16時点)

もっと!C、C++言語本

目次へ戻る

簡単な背景

何もないとさみしいので今回は簡単な背景を加えてみます。

上から下にスクロールし続ける感じの背景です。

まずはペイントを起動しましょう。

注意

ペイントは透明な部分がある画像は扱えません!もし使いたい場合はフリーソフトの「gimp」などをご使用ください!

画像(s-3-1)

スタートメニューの下のボタンを押して

画像(s-3-2)

表示されたアプリ画面の右側の方にあります。

ではペイントを起動します。

画像(s-3-3)

左上のファイルメニューのプロパティを選んでください。

画像(s-3-4)

ここで画像の大きさを決められるのでDXライブラリのウィンドウサイズに合わせて「640×480」にします。

画像(s-3-5)

ここに簡単な背景を描きます。

まず塗りつぶしで黒く塗りつぶします。

画像(s-3-6)

あとは鉛筆を選んで線の幅と色を好みで調整しながら点を打っていけば・・・。

画像(s-3-7)

星空の完成です。

画像(s-3-8)

画像の読み込み

「my_init_back_img()」を見てみましょう。

void my_init_back_img(){
	back_img = LoadGraph("../back_img.jpg");	
}

画像を使う時はまずメモリに画像ファイルを読み込みます。

その時に使う変数「back_img」は「int」型の変数になります。

LoadGraph("画像ファイルへのパス/画像ファイル名");

こちらの関数で読み込みます。

パスなどは大丈夫でしょうか?

ファイルのある場所って事ですね。

この場合はソースファイルのある場所が現在位置になります。

ちなみにソースファイルの場所は通常なら

ドキュメント

Visual Studio 2013

Projects

プロジェクト名

プロジェクト名

でソースファイルのあるフォルダに到達します。

画像(s-3-9)
LoadGraph("../back_img.jpg");

こちらの「../」は一つ上のという意味です。

もしソースファイルと同じトコロでいいなら「../」を書かずにファイル名だけで大丈夫です。

LoadGraph("back_img.jpg");

詳しくは「絶対パス 相対パス」などで検索してみてください。

次に変数初期化用の関数「my_init_variable()」を見てみます。

void my_init_variable(){
	gamecount = 0;
	Color_White = GetColor(255, 255, 255);
	back_img_y = 0;
}

「back_img_y」というのはさきほど作った背景画像をスクロールさせる為のy座標の変数になります。

他の変数とともに初期化しておきます。

座標の移動

それではスクロールさせる為に座標の移動計算をします。

void my_move_back(){
	back_img_y++;
	if (back_img_y > 480){
		back_img_y = 0;
	}
}

背景の座標の移動をする「my_move_back()」になります。

中身はさきほどの「back_img_y」をひたすらインクリメントしてが480以上になったら0になったら元に戻しているだけです。

画像の表示

あとはその計算した座標を使って少し工夫して表示すればスクロールする背景ができます。

背景表示の「my_draw_back()」を見てみます。

void my_draw_back(){
	DrawGraph(0, back_img_y, back_img, TRUE);
	DrawGraph(0, back_img_y - 480, back_img, TRUE);
	DrawLine(0, 240, 640, 240, Color_White);
	DrawLine(320, 0, 320, 480, Color_White);
	DrawFormatString(320, 240, Color_White, "(0,0)");
}

「DrawGraph()」という関数が画像表示の関数になります。

DrawGraph(x座標, y座標, 画像の変数名, TRUE);

左上のx,y座標を指定します。

最後の「TRUE」というのは画像の透明度の情報を使いたい場合は「TRUE」にします。これは透明度の情報がない画像でも「TRUE」のままで大丈夫です。

DrawGraph(0, back_img_y, back_img, TRUE);
DrawGraph(0, back_img_y - 480, back_img, TRUE);

あらためてこちらを見てみると画像を縦にずらして2枚を張り合わせるようなカタチで表示してます。

画像(s-3-10)

そしてy座標の「back_img_y」を動かす事によってあたかもずっと背景は続いているように表示できるワケです。

そして変数「back_img_y」が480になったら、つまりずらしておろしきったら

if (back_img_y > 480){
	back_img_y = 0;
}

と元に戻してあげます。

「double」

「back_img_y」は「double」で宣言しております。

C言語の入門からすぐこちらにこられた方は「double」は使い慣れてないかもしれませんが、より細かい計算によってあともう少しというニュアンスを出せるので積極的に「double」を使いましょう。

あとはせっかくなので原点表示という事を示すための座標軸を描いております。

DrawLine(0, 240, 640, 240, Color_White);
DrawLine(320, 0, 320, 480, Color_White);

直線を引く関数「DrawLine()」です。始点と終点を指定するだけで大丈夫です。

DrawLine(始点x, 始点y, 終点x, 終点y, Color_White);

簡単な背景の完成です。

画像(s-3-11)

変数も別に表示できるように「my_draw_variable()」を加えました。

void my_draw_variable(){
	DrawFormatString(440, 440, Color_White,
		 "gamecount = %d", gamecount);
}

ここまでの中間ソースになります。

中間ソース2

次回はいよいよプレイヤーを表示、移動させてみましょう。

次回

四日目 プレイヤーの表示と移動

□ページの先頭へ□

□HOME□

広告

↓2014年06月20日発売↓

14歳からはじめるC言語わくわくゲームプログラミング教室 Visual Studio 2013編

新品価格
¥2,500から
(2016/5/10 22:17時点)

↓2014年10月25日発売↓

超本格! サンプルで覚えるC言語 3Dゲームプログラミング教室

新品価格
¥3,110から
(2016/5/10 22:18時点)

↓2013年07月25日発売↓

小学生からはじめるわくわくプログラミング

新品価格
¥2,052から
(2016/5/10 22:21時点)

↓2016年05月13日発売↓

小学生からはじめるわくわくプログラミング2

新品価格
¥2,052から
(2016/5/10 22:22時点)

もっと!C、C++言語本

□ページの先頭へ□

□HOME□