C言語 入門

STGの作り方 目次

初心者向けSTG作成入門

HOME/STGの作り方 目次/
Wednesday, 18-Jan-2017 18:55:33 JST

広告

↓2016年02月29日発売↓

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

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

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

動作環境と使用コンパイラ

Windows 8
VS Express 2013 for Desktop

[DXライブラリを使用します!]

DXライブラリが初めての方は

付録 DXライブラリとは

こちらをご覧ください!

※いちよう動作確認したコンパイラになりますが、動作しない場合はご了承ください!

目次

はじめに

最終ソース

こちらはSTGに登場する自機、敵、弾などをテキスト(文字の事)で表したSTGの骨組みみたいなものになります。

なので派手な画像、音楽などは一切ありません。

DXライブラリをインクルードした状態で

最終ソースファイル開く→[ctrl+a]ですべて選択→[ctrl+c]でコピー→[ctrl+v]で貼り付け→コンパイル

でそのままお使いいただけます。

画像(s_i_1)

このような背景画像(640×480)を用意して「back_img.jpg」の名前でプロジェクト名のフォルダ内(ソースファイルが置いてある一つ上の階層です)に配置して頂ければほんの少しだけ臨場感が増すかもしれません。

いちよう三日目 簡単な背景にてこの簡単な背景の作り方を解説しております。

ステージ3までありますが敵の配置等は全て同じになります。

完成ソース

こちらは上記のプログラムに簡単な画像と音楽を加えたものになります。

同じくステージ3までありますが敵の配置等は全て同じです。

以下のような内容で用意した画像と音楽を同じようにプロジェクト名のフォルダ内に配置して

完成ソースファイル開く→[ctrl+a]ですべて選択→[ctrl+c]でコピー→[ctrl+v]で貼り付け→コンパイル

でお使いください。

当サイトの素材は「無料イラスト素材ドットコム」さんの素材を少し加工して使わせて頂いております。

星空の写真のみぱくたそさんの画像を使わせて頂いております。

bgm、効果音などは「音楽素材/魔王魂」さんから使わせて頂いてます。

「player_chip.png」

画像(s_i_2)

一マスが70×70、画像全体で280×210のプレイヤーの画像になります。

ちょっと画像ではわかりずらいですが2段目が左移動時、3段目が右移動時の画像になります。

当たり前ですが透過を加えた「png」画像で用意してください。

同じように

敵画像「enemy_chip.png」(140×490)

画像(s_i_3)

ボス画像「boss_chip.png」(600×900)

画像(s_i_4)

プレイヤーショット画像「player_shot_img.png」(20×20)

画像(s_i_5)

敵ショット画像「enemy_shot_img.png」(20×20)

画像(s_i_6)

ボスショット画像「boss_shot_img.png」(20×20)

画像(s_i_7)

バリアー画像「barrier_img.png」(20×20)

画像(s_i_8)

爆発エフェクト画像「exp_effect_chip.png」(140×70)

画像(s_i_9)

アイテム画像「item_img.png」(20×20)

画像(s_i_10)

オープニング画像「op_img.jpg」(640×480)

画像(s_i_11)

背景画像1「back_img.png」(640×480)

画像(s_i_12)

背景画像2「back_img2.jpg」(640×480)

画像(s_i_13)

オープニングや背景画像などで「jpg」も使っているのでご注意ください。

あと背景画像1「back_img.png」はわかりずらくなるので最初に紹介した簡単な星空画像と同じようにしましたが、背景画像2の上に重ねて表示するので透明な画像の上に星を表す点を打ったような画像になります。

次に音楽素材になります。

オープニングbgm「bgm1.ogg」

ステージ開始プレイヤー登場bgm「bgm2.ogg」

ステージ通常bgm「bgm3.ogg」

ボスbgm「bgm4.ogg」

ステージクリアbgm「bgm5.ogg」

エンディングbgm「bgm6.ogg」

決定se「se1.ogg」

プレイヤーショットse「se2.ogg」

爆発se「se3.ogg」

アイテム取得se「se4.ogg」

敵シールドse「se5.ogg」

プレイヤーボムse「se6.ogg」

ダウンロード

ダウンロード版になります。

sample_game

解凍後sample_gameフォルダ内のそのまたsample_gameフォルダ内のsample_game.exeをダブルクリックしてお使いください。

内容

あらためましてこちらは「C言語の入門は終わりました!」という方向けにゲームプログラミングの入門として「シューティングゲーム」の作成を目指した内容になっております!

今からC言語を始める方はぜひ当サイトの「小学生でもわかるC言語」「小学生でもわかるC言語2」をご利用ください!

注意

[DXライブラリ]を使用します。

DXライブラリが初めての方は

こちらをご覧ください!

付録 DXライブラリとは

※DXライブラリ著作権表記

DX Library Copyright(C)2001-2014Takumi Yamada

「ゲームプログラミングの館」さんのサイトを参考に、より初心者向けに内部構造に焦点を当ててゲームを作っていきます。

本格的なSTGに挑戦したい方はぜひ上記のサイトをご覧になってください!

当STG入門の特徴

1・ソース分けはしてません

2・テキスト(文字の事)で自機、敵機、ショットなどを表示

3・座標原点を画面中央に移動

4・数学の初歩的な関数の動きを使用

などなどキレイなグラフィック表示は置いといてまずはSTGの骨組みを完成させるところまでを目標とします。

なので画像や音楽を使用せずにテキストベースで話を進めてまいります。

標準関数と区別がつきやすいように自作関数の先頭に「my」とつけてあります。

注意

当STG入門の特徴の一つに座標原点を中央に配置というのがありますが、実際はその必要はまったくありません。あくまでも初歩数学の学習用として中央に配置しているだけです。

実際のプログラミング手法には合ってない表現などもありますので、あくまでも入門としてお使いください。

テキスト→グラフィック

もし「グラフィックじゃなきゃいやだ!」という方はこちらを参考にプレイヤー、敵などの表示に用いている

DrawFormatString(x座標,y座標,色の指定, "本文",変数);

こちらの関数を

int img;
img = LoadGraph("img.jpg");

使いたい画像ファイルを関数「LoadGraph()」で読み込んだ後で

DrawGraph(x座標, y座標, img, TRUE);

こちらの関数か

DrawRotaGraph(x座標, y座標, 1.0, 0.0, img, TRUE);

こちらの関数に置き換えてください。

「DrawGraph()」の方は画像左上の座標、「DrawRotaGraph()」の方は画像中心の座標を指定します。

「DrawRotaGraph()」の中ほどの数字は「1.0」となっているところは拡大率と「0.0」となっているところは回転率になります。

回転率についてはラジアン値を使用します。

最後の「TRUE」は透明度を利用する時は「TRUE」になりますが通常はどちらにせよ「TRUE」のままで大丈夫です。

画像のロードは一度すれば大丈夫なので初期化の時(whileのループに入る前)に行っておく事にも注意です。

画像の分割読み込み

完成ソースにもありますが画像を分割して読み込みたい場合は

LoadDivGraph("元画像パス",合計分割枚数,横分割数,縦分割数,
	横幅,縦幅,画像を保存する配列);

こちらの関数をお使いください。

例えば先ほどのプレイヤー画像「player_chip.png」(280×210)を読み込みたい場合は

int player_chip[12];

画像を保存する為の配列を用意して

LoadDivGraph("../player_chip.png",12,4,3,70,70,player_chip);

このように読み込みます。

これでplayer_chip[0]〜player_chip[11]にさきほどの画像が分割されて読み込まれます。

製作風景


中間ソース1(二日目)


画像(s_i_14)

最低限のプログラムになります。


中間ソース2(三日目)


画像(s_i_15)

背景を表示


中間ソース3(四日目)


画像(s_i_16)

プレイヤーを表示


中間ソース4(五日目)


画像(s_i_17)

プレイヤーショットを表示


中間ソース5(六日目)


画像(s_i_18)

敵を表示


中間ソース6(七日目)


画像(s_i_19)

敵ショットを表示


中間ソース7(八日目)


画像(s_i_20)

当たり判定を追加


中間ソース8(九日目)


画像(s_i_21)

爆発エフェクトを表示


中間ソース9(十日目)


画像(s_i_22)

アイテムを表示


中間ソース10(十一日目)


画像(s_i_23)

ボスを表示


中間ソース11(十二日目)


画像(s_i_24)

ボスの爆発エフェクトを追加


中間ソース12(十三日目)


画像(s_i_25)

ステージやらゲームオーバーやら


中間ソース13(十四日目)


画像(s_i_26)

敵の動き方を追加


中間ソース14(十五日目)


画像(s_i_27)

敵ショットの種類を追加


中間ソース15(十六日目)


画像(s_i_28)

自機ショットの種類を追加


中間ソース16(十七日目)


画像(s_i_29)

背景の敵


中間ソース17(十八日目)


画像(s_i_30)

敵の動き方を追加2


中間ソース18(十九日目)


画像(s_i_31)

バリアーとボム


中間ソース19(二十日目)


画像(s_i_32)

簡単な弾幕


中間ソース20(二十一日目)


画像(s_i_33)

ボスの動き方を追加


最終ソース(最終日)


画像(s_i_34)

実際のゲームの流れに合わせて敵を配置


完成ソース


画像(s_i_35)

画像や音楽を加えて完成!

次回

初日 STGの考え方

□ページの先頭へ□

□HOME□

C言語 入門

広告

↓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□

255103

Yesterday: 348 Today: 221

最終更新Tuesday, 15-Nov-2016 15:09:00 JST