AG10.ステージギミック(上下移動)を実装する
今回実装する機能
今回夜のステージに実装するのは「上下に移動する柱」です↓これを実装してLEVEL2のステージギミックにしていきます。
https://youtu.be/Q5Kb0szki2U
🐱では夜のステージ「LEVEL2」を完成させていきましょう!
①ステージギミックとなる柱を用意する
では今回は以下のステージギミックを実装していきます。
まずは一旦BP_FloatingStage(LEVEL1で実装した触れると落ちるステージ)とBP_Coinを全部削除します。現状こんな感じ↓
https://scrapbox.io/files/65d462e5c0edf900267a3480.png
これの中央のステージとコインを削除します↓
https://scrapbox.io/files/65d465e92a2fc6002551d2d4.png
StaterContents > Architecture > Pillar_50x500を追加します。
https://scrapbox.io/files/65d4660a8ef36c0024c8872c.jpg
トランスフォームを以下のように変更します。キャラクターが乗れる広さで細長くします。
位置→ (X=1065.279313,Y=-3520.104249,Z=-6027.421863)
回転→ (Pitch=0.000000,Yaw=0.000000,Roll=0.000000)
拡大縮小→ (X=3.389137,Y=3.389137,Z=11.876119)
https://scrapbox.io/files/65d466198631e30025623291.jpg
同じくPillar_50x500を選択した状態で、マテリアルをM_Brick_Cut_Stoneにします。
https://scrapbox.io/files/65d46625f306c6002540bf0f.png
今の所こんな感じの柱↓になっています。
https://scrapbox.io/files/65d466379334f900246148f2.gif
🐱ではレベルで見栄えを調整しつつアクタは作成できたので、この柱をブループリントクラスに変換してノードを作っていきます。
Pillar_50x500を選択した状態でノードみたいなアイコンをクリックします。
https://scrapbox.io/files/65d46669db866200250fa86c.jpg
ブループリント名を「BP_MovingPillar」にして、パスをJumper > Blueprintsにして選択をクリックします。
https://scrapbox.io/files/65d466829666b90025a15ea8.png
確認するとブループリントクラスに変換されたBP_MovingPillarがあります↓
https://scrapbox.io/files/65d46694d179e600257560d4.png
🐱こんな感じにレベル上で作成したアクタはブループリントクラスに変換する事ができます。レベル上で見栄えなど確認しつつ作っていきたいアクタはこのように、一旦レベル上で作成した後にブループリントクラスに変換するといった方法もあります。ではここからこのBP_MovingPillarを上下に往復移動させるノードを組んでいきたいと思います。
②柱を上下に繰り返し移動させるノードを作る
では以下のように柱を上下させるノードを作っていきます↓
https://scrapbox.io/files/65d466fb241f5d0024598abe.gif
BP_MovingPillarのイベントグラフを開きます。
https://scrapbox.io/files/65d4670b194e8100244e9d8f.png
🐱ではまず往復する座標を決めるためにゲーム開始時にスタート地点と折り返し地点をセットする処理を組んでいきます。
まずは三つの変数を作成します。StartLocationZ、EndLocationZ、MovableRangeZのfloat型(小数を扱う型)で作成します。初期値はそのままで良いです。
https://scrapbox.io/files/65d4672f3bf9c400253e2099.png
BP_MovingPillarのイベントグラフに以下を追加します。BeginPlayからGetActorLocationノードを追加してReturnValueを分割、ZからStartLocationに繋ぎます。+と検索して加算ノードでMoveableRangeZと足してEndLocationZにセットします。
https://scrapbox.io/files/65d4673abb0d690025114263.jpg
ノード解説
https://scrapbox.io/files/65d467a152e1da00258269e4.png
まずZ軸に対して柱を往復させるために、Z軸のスタート地点と折り返し地点のZ軸を決めておく必要があります。スタート地点となるStartLocationZに柱の初期位置のZ軸を入れておきます。その後、可動範囲となるMovebleRangeZを初期位置のZ軸と足して折り返し地点となるEndLocationにセットしておきます。
次にMovingLocationという名前のVector型の変数を作成して、コンパイルして初期値を0,0,1にします。
https://scrapbox.io/files/65d467b1f306c6002540d999.png
次にTickからAddActorLocalOffsetノードを追加します。DeletaLocationにMovingLocationをGetで追加します。
https://scrapbox.io/files/65d467bfe14243002694b01f.png
先ほどMovingLocationには(0,0,1)と入力したので上のノードの状態だと毎フレーム、Z軸に+1されて移動していきます。
AddActorLocalOffsetノードからはブランチを作成して、>と検索してGreater(より大きい)ノードを追加します。GetActorLocationを追加してRetunValueで右クリック > 構造体ピンを分割します。Greater(より大きい)ノードにはReturnValueZとEndLocatinZを繋げます。
https://scrapbox.io/files/65d468204a17e10024c22dc8.png
これで現在のアクタのZ軸の値がEndLocatinZの値より大きくなった場合、ブランチのtrue側の処理が行われます。つまり現在の柱の位置が折り返し地点のZ軸より高くなったらtrueになるという事です。
作成したブランチから以下のように作成します。true側にはSetでMovingLocationをセットして、0,0,-1とします。False側からはさらにブランチを追加してTrue側からMovingLocationで0,0,1とします。
https://scrapbox.io/files/65d46855aeecc70025104bfa.png
全体ノード解説
https://scrapbox.io/files/65d468944a17e10024c2347f.png
これで一体どういうノードを作ったのかというと、まずイベントtickでAddActorLocalOffsetで毎フレーム、MovingLocation分加算されて移動します。MovingLocationは初期値は0,0,1にしました。なので柱はZ軸に+1されて上昇されていきます。現在のZ軸がEndLocationZを越したらMovingLocationは0,0,-1になるので今度は下降していきます。下降していってStartLocationZの値より現在のZ軸が小さくなったら今度はMovingLocationは0,0,1にします。
https://scrapbox.io/files/65d468fc205dd00023797b9e.png
🐱といった感じにMovingLocationを現在のZ軸によって変更する事で、上昇と下降を繰り返す機能を実装しています。
MoveableRangeZの目のアイコンをクリックして目を開いた状態にします。
https://scrapbox.io/files/65d46a607f916500269f5ffc.png
この目のアイコンの意味とは？
この目はレベルエディタでアクタを選択した時に詳細ウィンドウに、この変数を表示するかどうかの設定です。変数を表示させる事で値を直接入力したり、変数の値を確認する事ができます。
一旦コンパイルする必要があるのでコンパイルしておきます。
レベル上の作成したBP_MovingPillarを選択した状態で、詳細 > デフォルト > MovableRangeZが表示されているので値を100にします。
https://scrapbox.io/files/65d46b368d16d200259b4c67.png
MovableRangeZって何の事だっけ？
先ほどの画像↓で言うところの、高さの可動範囲がMovableRangeZにあたります。
https://scrapbox.io/files/65d467a152e1da00258269e4.png
例えばスタート地点が0でMovableRangeZが200ならZ軸が0から200の値で上下に往復移動するようになります。
プレイしてみましょう。ただし柱は動きません。プレイを終了するとエラーを吐きます。
https://scrapbox.io/files/65d46b9a39b46e00246a889a.gif
🐱これよくあるエラーなんですが、こうなった時にはエラー文をまずはちゃんと読む事が重要です。
エラー文の読んで問題を解決しよう
出てきたエラー文です↓
https://scrapbox.io/files/65d46bb432df570025f92325.png
「/Game/Jumper/Maps/UEDPIE_0_LEVEL2.LEVEL2:PersistentLevel.BP_MovingPillar_C_UAID_3C7C3FF45F25356101_2111685919 のモビリティ：移動 をしたい場合は、StaticMeshComponent0 は「ムーバブル」にする必要があります。」と書かれています。どうやらBP_MovingPillarのスタティックメッシュコンポーネントをムーバブルにする必要があると書かれています。なのでその通りにしていきましょう。
BP_MovingPillarのStaticMeshコンポーネントを選択した状態でトランスフォーム > 可動性をムーバブルにします。
https://scrapbox.io/files/65d46bf4a0396c002574f36f.png
プレイしてみましょう。柱が上下に往復移動するようになりました。
https://scrapbox.io/files/65d466fb241f5d0024598abe.gif
柱が動かなかった理由は？
https://scrapbox.io/files/65d46c5ddc6c94002e78315a.png
柱が動かない理由はメッシュの可動性をスタティックに設定していたためです。スタティックに設定するとゲーム中にアクタは動かなくなります。なのでエラー文で「移動が変更可能なムーバブルの設定にする必要があります」と表示された訳になります。おそらくゲーム開発する上で必ず遭遇してしまうエラーなので、アクタが動かずに今回のようなエラーが出てきた場合は可動性をムーバブルに設定する事で解決できます。そもそもなんで可動性なんてめんどくさい事を設定する必要があるのか、これは可動性を設定する事でシステムが動くアクタか、動かないアクタなのか判断できてゲームの負荷処理を減らす事ができるためです。詳しくは「アクタの詳細設定の基本を解説」のページで可動性については解説しているのでチェックしてみてください。
🐱という事で上下に移動する柱が実装できました。複数配置してそれぞれMovableRangeZ(Z軸の可動範囲)を設定していきます。
レベル内のBP_MovingPillarを複製して合計10本ほど用意します。
https://scrapbox.io/files/65d46ca421f3f90024698f72.jpg
以下の様な感じにBP_MovingPillarの位置を調整します。なおこちらの位置に関しては何でも良いので自身で調整して頂いて構いません。
https://scrapbox.io/files/65d46ce0471f62002691f02f.jpg
https://scrapbox.io/files/65d46ce70c7af4002843402e.jpg
https://scrapbox.io/files/65d46cfd500ab000251f2d7e.jpg
また配置と同時にそれぞれのBP_MovingPillarのMovableRangeZも0~700ぐらいの値でそれぞれ入力していきます。
https://scrapbox.io/files/65d46d43dc6c94002e784796.png
プレイしてみましょう。柱はそれぞれ設定したMovableRanzeZ(可動範囲)で上下往復移動しています。
https://scrapbox.io/files/65d46dcd0af85f00240e03ab.gif
🐱位置や値は自身で調整してもらって構いません。時間はかかりますが調整するのもゲーム開発の醍醐味です。
BP_Coinも適当に配置しておきましょう。二本目、四本目、七本目、九本目のBP_MovingPillarの上に設置しておきました。
https://scrapbox.io/files/65d46db0f067550023b404b8.jpg
アウトライナーで配置したBP_Coinを、指定のBP_MovingPillarの子になるようにドラッグで追加します。例えばBP_Coinを二本目に設置した場合はそのBP_CoinをBP_MovingPillar2の子にします。
https://scrapbox.io/files/65d46ddfdb1c0a0024186c39.jpg
残りのBP_Coinも同じように子にしましょう。こうする事でBP_Coinも一緒に指定の柱の上下移動に合わせて移動するようになります。
https://scrapbox.io/files/65d46de86b036c0025580417.jpg
完成!
プレイしてみましょう。上下移動する柱をステージギミックとして実装できました!
https://youtu.be/EC8zb4zdApo
なおクリアした時にLEVEL1 COMPLETED!と表示されますが次回修正していきます。
🐱これでLEVEL2のステージはほぼ完成しました!次回、ステージクリアの時にLEVEL1からLEVEL2へレベル遷移させる機能などを作っていきたいと思います!