執筆バージョン: Unreal Engine 4.26 |
皆さんこんにちは!株式会社ヒストリア新人ゲームデザイナーの黒田Rです。
最近になって初めて、Tキーを押すことで半透明のメッシュを選択可能にできることを知りました….
今回は、そんな私でも簡単に理解できたドアブループリントの作成方法をご紹介します。
目次
- 事前事項
- ドアのブループリントを作成
- プレイヤーがキーを押したかの判定
- 開閉アニメーションの作成
- 完成!
①事前事項
- 今回はプレイヤーを動かしてドアを開けるなどの動作を行うためFirstPersonのテンプレートを使用しています
- ドアのメッシュはStarterContentにあるSM_Doorを使用していますが、他のスタティックメッシュでの代用も可能です
- こまめにコンパイルとセーブをしましょう!
②ドアのブループリントを作成
現実世界だと「自動ドアの方がハイテク!」という認識がありますが、
Unrealでは手動ドアの方が少し難しいです。(インプット情報が多いため)
まず、新しいアクターのブループリントを作成します
(名前はわかりやすいようにBP_Doorで作成しています)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/CreateBP-300x163.png)
作成したブループリントに名前を付けて保存したら、ダブルクリックで中を開きます。
左上の「+Add Component」から「Static Mesh」を追加し、
ドアのメッシュを設定します。
(名前はわかりやすくDoorにしています)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/AddStatMesh-300x173.png)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/SetDoor-300x173.png)
次に、「+Add Component」から「Box Collision」を追加し、
ドアを開けるキーを押したときにドアを開けられる範囲を設定します。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/4_BoxColl-300x98.png)
2つのコンポーネントを追加したら「Event Graph」に移り、判定の設定をしていきます!
③プレイヤーがキーを押したかの判定
※最初に「Event Graph」を開いた時にある3つのノードは使用しないので削除しても大丈夫です。
まず、追加したBox Collisionを右クリックし2つのイベントを追加します:
- 「Add On ComponentBeginOverlap」→ボックス内に入っている判定
- 「Add On ComponentEndOverlap」→ボックスに入っていない判定
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/5_BoxEvent-300x107.png)
追加したイベントの「Other Actor」からノードを引っ張り、
「Cast To FirstPersonCharacter」に繋げます。
(プレイヤーだけが判定対象になります)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/6_BoxLinkChar-300x115.png)
さらに、下記イベントを追加しノードを繋ぎます:
- 「Get Player Controller」を追加します
- ReturnValueからノードを引っ張り、「Enable Input」のイベントを追加します。
(最初はTargetに繋がってしまうので、Player Controllerに繋げ直す必要があります)
- 2と同じ手順で「Disable Input」のイベントも追加します。
- 最後に「Add On ComponentBeginOverlap」を「Enable Input」と、
「Add On ComponentEndOverlap」を「Disable Input」と繋げます。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/6_Enable-300x157.png)
これによって、プレイヤーがボックス内にいる間しか、特定の入力ができなくなりました!
次に、ドアを開くための入力キーを設定します。
左上の「Edit」から「Project Settings」を開き、
下記手順で入力キーを設定します:
- Inputの設定を開く
- 「Action Mappings」を開き、「+」を押して新しい入力を追加します
- 名前は後で使用するので、今回は「OpenDoor」で設定します。
名前入力の下のドロップダウンを開き、設定したい入力キーを探します。
(今回はEnterキーでドアを開けます)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/7_SetButton-300x116.png)
入力キーの設定を終えたらProject Settingsを閉じ、Event Graphに戻ります。
空いているスペースを右クリックし、先ほど設定した名前のイベントを追加します。
(今回はOpenDoorで見つかるはずです)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/8_PressKey-300x208.png)
次に、開いているスペースでGキーを押しながら左クリックを押し、
「Gate」のイベントを作成します。
「Gate」を追加したら下記のように繋げてください。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/9_Gate-300x155.png)
これで、プレイヤーがボックス内にいる時にのみEnterを押すことで特定のことができるようになりました!
さて、最後にドアの開閉アニメーションを設定していきます。
④開閉アニメーションの作成
最初に、前のステップで追加した「Gate」のExitからノードを引っ張り、
「Flip Flop」のイベントを追加します。
(FlipFlopは、1回目に押すとAのイベントが実行され、2回目はB、3回目はまたAという風にイベントを実行してくれます)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/10_FlipFlop-300x134.png)
「Flip Flop」のAからノードを引っ張り、「Timeline」を追加します。
追加したTimelineに名前を付け、「FlipFlop」のBをReverseに繋げます。
(これにより、閉じるアニメーション=開くアニメーションの逆再生という風になります)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/11_Timeline-300x298.png)
次に作成したTimeLineをダブルクリックし、中にアニメーションを設定していきます。
中を開くとこんな感じになっています↓
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/12_InTimeline-300x211.png)
「Length」の横に書いてある数字がドアを開けるアニメーションの再生時間になります。
(今回私は2秒に設定しました)
ではまず、左上の「F+」というのを押し、FloatTrackを追加します。
(追加した際に名前を設定できるのでDoor Trackで設定します)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/13_FloatTrack-1-300x101.png)
トラックの開いているところを右クリックし「Add key to CurveFloat_0」を追加します。
追加したkeyのTimeとValueを設定します:
- Time=0
- Value=0
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/14_FirstKey-300x198.png)
上記手順と同じ手順でもう1つKeyを追加し、今度は
で設定します。
これでTimelineの中身設定は完了ですので、閉じます。
Event Graphに戻り、Timelineの「Door Track」からノードを引っ張り、
「Lerp」というイベントに繋ぎます。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/15_Lerp-300x199.png)
最初に繋いだ時はAに繋がってしまうので、Alphaに繋ぎなおします。
また、AとBは右クリックし変数に昇格させます。
(Aはドアが閉まった状態の角度なのでCloseAngle、
Bはドアが開いた状態の角度なのでOpenAngleに設定します)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/16_ClOpAngle-201x300.png)
ここで一度Compile+Saveします。
※↑をすることで、変数内の値を設定することができるようになります
CloseAngleの変数はドアが閉じている状態なので初期値の0で大丈夫です。
OpenAngleは開けたい角度を設定します。
(今回は手前に開くようにしたいので90と設定します)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/17_OpenAngle-300x169.png)
※開く角度はViewportでドアメッシュを回転することで確認することができます。
次に、ドアのスタティックメッシュを開いているスペースにドラッグ&ドロップします。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/18_DDD-300x169.png)
ドアの変数からノードを引っ張り、「SetRelativeRotation」を追加します。
追加したらTimelineのUpdateとSetRelativeRotationを繋ぎます。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/19_RelRot-276x300.png)
次にSetRelativeRotationの「New Rotation」を右クリックし、
「Split Struct Pin」を選択します。(より、詳細な回転設定ができるように)
最後に、Lerpの「Return Value」を「New Rotation Z (Yaw)」に繋げます。
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/20_Split-300x217.png)
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/21_NewZ-300x144.png)
⑤完成!
Compile+Saveしたら、実際に作成したBP_Doorをステージに配置し、
Playで近づいてEnterキーを押してみましょう。
すると….
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/22_Open-300x168.png)
無事開きました!!!
もう一度押すと…
![](https://historia.co.jp/wp/wp-content/uploads/2021/03/23_Close-300x245.png)
ちゃんと閉じました!
すごくシンプルではありますが、これで「キーを押すと開くドア」が完成しました!
もっと良くするためにSEを鳴らしたり、UIを表示させたり…
などなどたくさん工夫できる箇所もあるので、是非試してみてください!