GameMakerStudio 簡単なシューティングゲームの作り方 ③

うっほー！ゴッリラだよ！

皆、おひさしぶり！テスト期間でしばらく活動できていなかったけど、今日から復活するよ！

裏切ったのか… スケットおおおお(ﾉﾟοﾟ)ﾉ

(*ﾟзﾟ) ～♪

おいら、バナナは好きだよ！！！　だ、だってゴリラだもん(;ﾟ;Д;ﾟ;)

さ、さて！今回はアステロイド風ゲームの続きを作っていくよ！！
まだ、パート①、②をやっていないよ！っていう人は、先にそっちを終わらせてね！

アステロイドを作ってみよう！パート①

2018年10月27日

アステロイドを作ってみよう！パート②

2018年11月7日

今回のゲームに使用する素材ファイル

★目次

4. プレイヤーが打つ弾を作ろう！
5. 破片を作ろう！
6. 射撃機能を実装しよう！
- ・プレイヤーのStep Eventを開こう！
- ・ゲームをテストしてみよう！
まとめ
- ・宣伝

4. プレイヤーが打つ弾を作ろう！

前回は、敵である隕石オブジェクトを作成したよ！
このパート③では、プレイヤーが隕石を攻撃できる機能を実装していこう！

・弾のSpriteを作成しよう！

実は、GameMakerStudioは元々、グラフィックス作成ツールだったんだ！
その名残から、Spriteを描写できる機能が備わっているよ！

今回はGMSのグラフィックス機能を使って、弾のSpriteを描いてみよう！
まずは、隕石の時と同じ手順で新しいSpriteを作成しよう！

画面右Resrouce内のSpriteを右クリック → Create Sprite

①Sprite名を変更しよう！
自分で分かるなら、どんな名前でもいいよ！(おすすめはs_bullet)

②Size:下の四方向矢印アイコンをクリックしよう！

ここでは、Spriteのサイズを変更することができるんだ！Width、Heightの値を1に変更してね！

③Edit Imageをクリックしよう

すると、Spriteを描いたり、編集することのできるImage Editorが開かれるよ！

1,ペンツールを選択しよう
これは、絵を描きたい時に使用するんだ！上のBrashesでサイズを設定できるよ！

2,色を選択しよう！
プレイヤーの発射する弾の色を選ぼう！(おすすめは白色)

3,枠内を塗りつぶそう
ここがSpriteを描く場所なんだ！今回サイズを1×1に設定したから一色しか塗れないよ！

Image Editorについては、また別の記事で詳しく解説する予定だから、
今はGMS上でSpriteを編集出来るということを覚えていてね！

・弾丸オブジェクトを作成

Spriteはこれで完成だよ！次に弾丸オブジェクトを作成していこう！

画面右Resource内のObjectを右クリック　→　Create Objectを選択

①オブジェクトの名前を変更しよう！
おすすめはo_bulletだよ！

②弾丸オブジェクトのSpriteを設定しよう
・・・をクリックすると選択画面がでてくるので、弾丸のSpriteを選択しよう！

・Create Eventを作成しよう！

③Add Eventをクリックして、Create Eventを追加しよう！

ここでは、弾速であるspeedを宣言するよ！

speed = 6;

1	speed = 6;

おさらい！speedは、インスタンスの移動速度を管理する組み込み変数で、
毎フレーム指定されたピクセル分インスタンスを、directionの方向に動かすよ！

・Collision Eventを追加しよう！

④Add Eventをクリックして、Collision Eventを追加しよう！

今回初登場のColision Eventは、インスタンス同士が重なりあった時に
呼び出される、イベントの事だよ！いわゆる、当たり判定ってやつだね！

以下のコードを記述法してね！

instance_destroy();
with(other) 
{
	instance_destroy();
	if(sprite_index == s_asteroid_l)
	{
		repeat(2)
		{
		var ast = instance_create_layer(x,y,"Instances",o_asteroid);
		ast.sprite_index = s_asteroid_m;
		}
	}
	else if(sprite_index ==s_asteroid_m)
	{
	  repeat(2)
	   {
	      var ast = instance_create_layer(x,y,"Instances",o_asteroid);
	      ast.sprite_index = s_asteroid_s;
	   }	
	}
	repeat(10)
	   {
	      instance_create_layer(x,y,"Instances",o_debris);	
	   }
}

instance_destroy();

with(other)

{

instance_destroy();

if(sprite_index == s_asteroid_l)

{

repeat(2)

{

var ast = instance_create_layer(x,y,"Instances",o_asteroid);

ast.sprite_index = s_asteroid_m;

}

else if(sprite_index ==s_asteroid_m)

{

repeat(2)

{

var ast = instance_create_layer(x,y,"Instances",o_asteroid);

ast.sprite_index = s_asteroid_s;

}

repeat(10)

{

instance_create_layer(x,y,"Instances",o_debris);

}

これだけ見ると物凄く複雑そうに見えるけど、ブロック毎に説明するから安心してね！

instance_destory()

1	instance_destory()

最初のinstance_destory()では、隕石に弾が当たった時インスタンスを消去しているよ！

with(other)
{
省略...
}

with(other)

{

省略...

}

With構文
本来、オブジェクト外のインスタンス変数にアクセスするときは、インスタンス名、idをつける
必要があるけど、withを使うことで、指定したオブジェクトの変数をそのまま呼び出す事が
出来るようになるんだ！

例えば、プレイヤー変数内で弾オブジェクトを削除したい時、そのままinstance_destroy()を
呼び出すとプレイヤーを削除してしまうよね？

なので、削除したいオブジェクトを指定する必要があったけど、with構文を使うことによって、
インスタンス変数にそのままアクセスすることが出来るようになるんだ！

//本来
instance_destory(); //プレイヤーを削除してしまう
instance_destory(o_bullet); //弾インスタンスを削除(指定する必要がある)

//with構文
with(o_bullet)
{
   instance_destory(); //弾インタンスを削除
}

//本来

instance_destory(); //プレイヤーを削除してしまう

instance_destory(o_bullet); //弾インスタンスを削除(指定する必要がある)

//with構文

with(o_bullet)

{

instance_destory(); //弾インタンスを削除

}

それを踏まえた上で、with内のコードを見ていこう！

with(other)
{
 instance_destory();
 if(sprite_index == s_asteroid_l)
 {
    repeat(2)
    {
       var ast = instance_create_layer(x,y,"Instances",o_asteroid);
       ast.sprite_index = s_asteroid_m;
     }
 }...

with(other)

{

instance_destory();

if(sprite_index == s_asteroid_l)

{

repeat(2)

{

var ast = instance_create_layer(x,y,"Instances",o_asteroid);

ast.sprite_index = s_asteroid_m;

}

}...

このotherというのは、弾と衝突したインスタンスの事を指しているんだ！

otherではなくo_asteroidを指定してしまうと、弾と衝突していない全ての隕石が対象になってしまうから、注意が必要だよ！

まずは、instance_destroy()を使って隕石をゲームから削除しているよ！
次のif文では、インスタンスのSpriteを確認して、もし大隕石であればif文内の処理を実行
しているんだ！

if(sprite_index == s_asteroid_l)
{
   repeat(2)
    {
      var ast = instance_create_layer(x,y,"Instances",o_asteroid);
      ast.sprite_index = s_asteroid_m;
     }
}

if(sprite_index == s_asteroid_l)

{

repeat(2)

{

var ast = instance_create_layer(x,y,"Instances",o_asteroid);

ast.sprite_index = s_asteroid_m;

}

repeatというのは、{}ないで囲まれたコードを()内の回数実行してくれる構文なんだ！
つまり、ここでは弾が衝突した隕石が大隕石であった場合、中隕石を二つ生成させているんだ！

else if(sprite_index ==s_asteroid_m)
{
   repeat(2)
   {
      var ast = instance_create_layer(x,y,"Instances",o_asteroid);
      ast.sprite_index = s_asteroid_s;
   }	
}

else if(sprite_index ==s_asteroid_m)

{

repeat(2)

{

var ast = instance_create_layer(x,y,"Instances",o_asteroid);

ast.sprite_index = s_asteroid_s;

}

同様に次のelse if文では、隕石が大隕石でなかった場合、中隕石であるかどうかを確認して、
そうであれば、小隕石を二つ生成しているよ！

Spriteが小隕石の場合は、何の処理も行わないよ！

repeat(10)
{
   instance_create_layer(x,y,"Instances",o_debris);	
}
}

repeat(10)

{

instance_create_layer(x,y,"Instances",o_debris);

}

最後にrepeat構文を使って、破片インスタンス“o_debris”を10個作成しているんだ！
これで、弾が惑星に当たった時のリアル感が増すよ！

まだ破片オブジェクトを作成していないので、ゲームを実行した時にエラーが起きても安心してね！

これで、弾と惑星の衝突処理は完成だよ！

5. 破片を作ろう！

次に、弾が隕石に当たった時に飛び散る破片を作っていこう！

・破片のSpriteを作成しよう！

弾Spriteを作った時と同じ手順で、破片Spriteを描いてみよう！

Sprite名を”s_debris”、Width、Heightの値を1にして、白色で塗ってね！
やり方が分からなかったら、少し上にスクロールして復習しよう(*’▽’)

・破片オブジェクトを作成しよう！

画面右Resource内のObjectを右クリック　→　Create Objectを選択

①Sprite名を変更しよう！
自分で分かるならどんな名前でもいいよ！(おすすめはs_debris)

②破片オブジェクトのSpriteを設定しよう
・・・をクリックすると選択画面がでてくるので、破片のSpriteを選択しよう

・Create Eventを追加しよう

③Add Eventをクリックして、Create Eventを追加しよう！
それができたら、以下のコードを記述してね！

direction = irandom_range(0,359);
speed = 1;

1 2	direction = irandom_range(0,359); speed = 1;

惑星とまったく同じコードなので、説明は省略させてもらうね！

いやわからんわ！というそんな君へ( ^0^)θ～♪
ここでは、irandom_range関数を使って、破片の進行方向をランダムに設定した後に、破片の移動速度である
speedを1に設定しているんだ！

・Step Eventを追加しよう！

④Add Eventをクリックして、Step Eventを追加しよう！

ここでは、破片が発生した後徐々にフェードアウトする処理を追加するよ！
Step Eventには、以下のコードを記述してね！

image_alpha-=.01;

if(image_alpha <=0) 
{
  instance_destroy();	
}

image_alpha-=.01;

if(image_alpha <=0)

{

instance_destroy();

}

image_alphaは、Spriteの透明度を管理する組み込み変数だよ！
値が1から0に近づくほど、徐々に透明度が高くなるんだ！(0で不透明)

ここでは、毎フレームimage_alphaの値を-0.1ずつ引いているんだ！
そして、image_alphaの値が0以下になった時、ゲームから削除しているよ！

6. 射撃機能を実装しよう！

これで準備は整った！(･`ω･)

最後に、プレイヤーがSPACEキーを押したとき、弾が発射される機能を追加していこう！

・プレイヤーのStep Eventを開こう！

パート①で、プレイヤーのStepEventに以下のコードを記述したよ！

if(keyboard_check(vk_right)) 
{
    image_angle-=rotateSpeed;
}

if(keyboard_check(vk_left)) 
{
    image_angle+=rotateSpeed;	
}

if(keyboard_check(vk_up))
{
    motion_add(image_angle,moveSpeed);	
}

move_wrap(true,true,sprite_width);

if(keyboard_check(vk_right))

{

image_angle-=rotateSpeed;

}

if(keyboard_check(vk_left))

{

image_angle+=rotateSpeed;

}

if(keyboard_check(vk_up))

{

motion_add(image_angle,moveSpeed);

}

move_wrap(true,true,sprite_width);

最後のmove_wrap関数の前にこのコードを追加しよう！

if(keyboard_check_pressed(vk_space))
{
   var bullet = instance_create_layer(x,y,"Instances",o_bullet);
   bullet.direction = image_angle;
}

if(keyboard_check_pressed(vk_space))

{

var bullet = instance_create_layer(x,y,"Instances",o_bullet);

bullet.direction = image_angle;

}

ここでは、スペースキーが押されたときに、弾インスタンスを作成して
bulletという変数にインスタンスのidを代入しているよ！

インスタンスのidに.を付けることで、インスタンス変数にアクセスすることが
出来るようになるんだ！詳しいことはオブジェクトの記事で解説しているよ！

その後に、作成した弾の進行方向をプレイヤーの向きを管理する、
image_angleの値に設定しているんだ！

弾オブジェクト内で、既にspeedを宣言したから、弾はプレイヤーの向いている方向に
speedの値進んでいくよ！

・ゲームをテストしてみよう！

これで、プレイヤーが弾を撃てるようになったよ！実際にゲームを実行して
確認してみよう！(*’▽’)

隕石とプレイヤーインスタンスが、画面に配置されているかチェックしてね！

画像のように、スペースキーを押したときに弾が発射され、弾が隕石に当たった時
破片と共に一つサイズの小さい隕石が生成されていたら、成功だよ！

エラーが起きたら、コードに打ち間違いがないか確認してみてね！

質問があればいつでも@hellomanaki、コメントで大歓迎だよ！

まとめ

お疲れ様！これで今回のパートはおしまいだよ！

長い回だった_(:3｣ ∠)_

時間をかけた甲斐があって、かなりゲームぽくなってきたね！！(∩´∀｀)∩

次回は、プレイヤーのHP、スコアを追加していく予定だよ！
また更新されるまで、楽しみに待っていてね！

ここで作業を中断する場合は、プロジェクトを保存しておこう！

Control + S または画面上のFileをクリック　→　Save Projectを選択

それじゃあ、また次の記事で会えることを楽しみにしているよ！

・宣伝

Amazonが提供している、本を朗読で聞くことのできるサービス！
今なら無料体験で12/12までの間、最大3000円分のAmazonポイントを獲得できるよ！
退会も簡単に出来るから、気になったら試してみてね！(*’▽’)

いますぐAudibleを無料体験してみる！

10+

解説本当お疲れ様です！
パート４も待ってます(´・ω・`)ｺﾞﾘ

アステロイドを作ってみよう！パート③

4. プレイヤーが打つ弾を作ろう！

・弾のSpriteを作成しよう！

・弾丸オブジェクトを作成

・Create Eventを作成しよう！

・Collision Eventを追加しよう！

5. 破片を作ろう！

・破片のSpriteを作成しよう！

・破片オブジェクトを作成しよう！

・Create Eventを追加しよう

・Step Eventを追加しよう！

6. 射撃機能を実装しよう！

・プレイヤーのStep Eventを開こう！

・ゲームをテストしてみよう！

まとめ

・宣伝

6 件のコメント

コメントを残すコメントをキャンセル

ABOUTこの記事をかいた人

NEW POSTこのライターの最新記事

アステロイドを作ってみよう！パート⑤

【初心者必見】GameMaker入門におすすめな学習サイト/チュートリアル

GameMakerStudio2で日本語を表示する方法

[初心者向け]シンプルな避けゲームを作ってみよう！

プロフィール

カテゴリー

YouTube

4. プレイヤーが打つ弾を作ろう！

・弾のSpriteを作成しよう！

・弾丸オブジェクトを作成

・Create Eventを作成しよう！

・Collision Eventを追加しよう！

5. 破片を作ろう！

・破片のSpriteを作成しよう！

・破片オブジェクトを作成しよう！

・Create Eventを追加しよう

・Step Eventを追加しよう！

6. 射撃機能を実装しよう！

・プレイヤーのStep Eventを開こう！

・ゲームをテストしてみよう！

まとめ

・宣伝

6 件のコメント

コメントを残す コメントをキャンセル

RECOMMENDこちらの記事も人気です。

アステロイドを作ってみよう！パート④

アステロイドを作ってみよう！パート①

アステロイドを作ってみよう！パート②

アステロイドを作ってみよう！パート⑤

ABOUTこの記事をかいた人

NEW POSTこのライターの最新記事

アステロイドを作ってみよう！パート⑤

【初心者必見】GameMaker入門におすすめな学習サイト/チュートリアル

GameMakerStudio2で日本語を表示する方法

[初心者向け]シンプルな避けゲームを作ってみよう！

プロフィール

人気記事

カテゴリー

YouTube

コメントを残すコメントをキャンセル