Chapter 39無料公開

📰シューティングゲームを作る(1)移動する的の実装 [UE5入門チュートリアル #3-13]

Daichi
Daichi
2022.05.29に更新

コメント🐤

今回からブループリントの応用編として簡単なシューティングゲームを作っていきたいと思います。このシューティングゲーム作成はこの本一巻の四章までの応用であり、それ以外の解説していない機能についてはなるべく使用せずに解説しています。なおYouTubeでの解説動画はこの本一巻が大体完成したら作成予定ですので、いましばらくお待ちください。

今回作成するシューティングゲーム

https://www.youtube.com/watch?v=_lGkNMTccHY
今回から4ページに渡ってこの動画のシューティングゲームを作成していきます。20秒間でどれだけ的に弾をヒットさせてスコアを稼げるのかというゲームです。UI(画面上のテキストなどの表示)はまだこの本のチュートリアル最後の方で解説するので使用していません。小さいですが左上にスコア(青色)とタイマー(赤色)もPrintStringノードによって表示されます。

このページで実装する機能↓

今回はプロジェクトを作成する所から、ゲームの基盤となる左右へ移動する的を作成します↓

https://www.youtube.com/watch?v=CxXjieT3HGU

①レベルのステージを作る

  1. プロジェクトを作成します。ゲーム > ファーストパーソン > スターターコンテンツ > プロジェクト名にShootingGameと入力します。

  2. レベルが表示されました。

    今回ステージの中に配置されているオブジェクトはほとんどいらないので、削除していきます。

  3. Block01フォルダからCylinderフォルダの最後の下のアクタまでShiftを押したままクリックして、Deleteで削除します。

  4. 続いてSimulatedCubesフォルダの中身を削除します。

  5. レベルの内容はこんな感じになりました↓空になったフォルダはまだ残っていますので、気になる方は削除しておきましょう。

  6. 一旦これで問題なくプレイできるか確認しておきます。

②的の3Dモデルを作成する

では、銃で撃つ標的となる「3Dモデルの的」を作成していきます。

  1. コンテンツブラウザを開きます。コンテンツフォルダを開いて右クリック > フォルダを新規作成します。名前はBlueprintsにします。

  2. Blueprintsフォルダを開いて、ブループリントクラス > Actorを選択し、名前をTargetにします。

  3. ブループリントクラスを開きます。

  4. コンポーネントから追加でCylinderを追加します。日本語エディタの場合、日本語でシリンダーと検索します。バグで表示されない場合があるのでそんな時はシリンダーコンポーネントを探してください。

  5. W,E,Rキーで移動,回転,拡大縮小を切り替えながら以下のトランスフォームにします。

  6. シリンダーのコンポーネントをCtrl+Dでコピーします。合計二つになります。

  7. コピーして作成したCylinder1のコンポーネントを選択した状態で大きさを調整し、的の中央に小さめのシリンダーになるようにトランスフォームを変更します。

    次に色をつけていきましょう。

コメント🐤

マテリアルを使用しますが、マテリアルとはオブジェクトの外観を作成,編集できるアセットの事になります。作成してみましょう。

  1. コンテンツフォルダにMaterialsフォルダを作成します。

  2. 右クリック > マテリアルを選択して、名前をTargetColorにします。

  3. ダブルクリックで開きます。このマテリアルエディタではブループリントと似たグラフ方式で、3Dモデルの外観、つまり見た目の部分を作っていきます。中央のメインマテリアルと呼ばれるノードに様々なノードを接続して作成します。

  4. ベースカラーからドラッグで伸ばし、Constant3Vectorを作成します。Constant3Vectorとは、三つの値によって色を決定するノードになります。

  5. 作成したConstant3Vectorノードをダブルクリックして、カラーピッカーを開き色を黄色にします。

    カラーピッカーのHex線形はFF8E0000にしました(コピペで同じ色にできます)。

  6. 適用をクリックします。

  7. ブループリントクラスを開いてCylinderコンポーネントを選択した状態で、マテリアルを作成したTargetColorにします。

    では、中央の部分のマテリアルも作成しましょう。

  8. 今作ったやり方と全く同じようにして今度はオレンジ色を作成します。

    名前はTargetCenterColorにします。

    カラーピッカーのHex線形はFF0D0000にしました(コピペで同じ色にできます)。作成したら忘れずに適用をクリックします。

  9. 中央の部分、Cylinder1のコンポーネントを選択した状態で、作成したオレンジのマテリアルを選択します。

  10. ブループリントクラスをレベルに追加してみて的が出来ているか確認しておきます。

  11. これで的となる3Dモデルは完成です。下のgifでは的の色がおかしく表示されてますが、gifの問題なので無視してください。

    Ctrl+Shift+Sキーでレベルとアセットの一括保存を、きりが良いタイミングで行っておきましょう。

コメント🐤

なお、本来であればこういったゲームで使用する3Dモデルは外部ソフトで制作してUnrealEngineに持ってくるのが通常のやり方です。今回は簡単なチュートリアルという事でUnrealEngine内で簡単に作成してみました。

③的を移動させる

では、的を左右に移動させたいのでまずは右へ進むように実装してみましょう。

  1. 作成したブループリントクラスTargetを開いて、イベントグラフを開きます。

  2. イベントTickからAddActorLocalOffsetノードを作成し、DeltaLocationのXに5と入力します。

    このノードで、毎フレームx軸に5が追加されるといったノードになります。

  3. プレイしてみましょう。的が移動するようになりました。(gifの色がおかしいのは無視で)

    今度はこの的を左右に移動するようにしましょう。

コメント🐤

この的は後からゲームプレイ中に左右に生成していく予定なので、画面右で生成された場合は左に進み、左で生成された場合には右に進むようにしたいと思います。

  1. 変数のプラスボタンから変数を作成します。名前はMovingDirectionにして、Vector型にします。そのまま追加してAddActorLocalOffsetノードのDeltaLocationに接続します。

    Vectorは三つの小数からなる変数で、この変数の数値を的の初期位置によって変更させたいと思います。

  2. レベルに配置された的をAltキーを押しながら移動させて複製します。ステージの左右になるようにそれぞれ配置します。

  3. x軸を確認してみます。画面右の的がx軸が0で、左が3000なので、大体中央のx軸1500よりx軸が下回る的は右から左へ、1500よりx軸が上回る的は左から右へ移動するようにします。

  4. 的のブループリントクラスを開いて、以下のノードを作成します。ブランチを作成して「<(Less:より少ない)」ノードを追加し、GetActorLocationノードで位置を取得します。Lessノードには下に1500と入力します。

ヒント🐤

GetActorLocationノードは、単体でまず作成してそのあと右クリック > 構造体ピンの分割でX,Y,Zそれぞれ分割して出力できるようします。

  1. MovingDirectionの変数をドラッグで追加しセットノードを作成します。trueから繋がるノードにはX軸に-5.0を、falseから繋がるノードには5.0を入力します。

  2. ノードの解説は後回しにして一旦再生してみましょう。

https://www.youtube.com/watch?v=CxXjieT3HGU
右にある的は左へ進み、左ある的は右に進むようになりました。

完成!ノードの解説

コメントをつけて以下のようにしました↓

確認&コピペはこちら↓

https://blueprintue.com/blueprint/_3z5_b3f/
イベントBeginPlayノードは、ゲームプレイ中に生成されたブループリントクラス内にある場合、生成されたタイミングでノードが実行されます(今回はテストのため既に配置済みですが後からこの的は削除してゲームプレイ中に生成させます)。なのでアクタが生成されたタイミングで、現在のx座標が1500より小さい場合に左に進み、1500以上だった場合に右に進むように設定しました。イベントTickのAddActorLocalOffsetによってアクタは移動しています。

コメント🐤

ノードについて簡単にまとめると「的の最初の座標によって左右に進むか決定する」という事になります。は次に、的をゲームプレイ中に一定間隔で生成していきたいと思います。