UE5.3を使用したゲーム制作備忘録を作成中!

モバイル向けゲームを作るため日々奮闘中!
同じ悩みを持つ人たちの、解決の糸口になれば幸いです。

詳細はこちら
PR
スポンサーリンク

Unreal Engine コツコツ自習_プレイヤーの移動に合わせてアニメーションさせる【3D×2Dゲーム】

UEコツコツ自習シリーズ
スポンサーリンク

簡単な3D×2Dゲームを作ろう

3D×2Dゲーム制作の練習シリーズです。

アンリアルエンジンで3D×2Dゲーム制作方法をまとめていきます。

2Dゲーム制作の練習シリーズ」で行った説明を省略したり、細かな数値設定などの説明をしない場合もありますので、ご参考程度で確認ください。

※作業環境:UEバージョン5.3.2 Windows11

プレイヤーの移動に合わせたアニメーション

前回の記事でプレイヤーの移動が実装できたので、今回は移動方向に合わせてアニメーションの種類を変更していきます。

2Dアニメーションを準備する

まだ移動中のアニメーションしか準備していなかったので、止まっている時のアニメーションも準備します。

「AS_Player」に「Idle」アニメーションを追加します。

作成方法を忘れた方は、下の記事で紹介していますので確認してください。

「PaperZD AnimBP」を作成する

「PaperZD AnimBP」は、2Dキャラクターにアニメーションを割り当てるのにとても便利です。

コンテンツ内で右クリックして、「PaperZD」の「PaperZD AnimBP」を選択します。

「Pick Paernt Animation Source」画面になるので、「AS_Player」を選択します。

ファイル名は「ABP_Player」にします。

ファイルを開いて「AnimGraph」画面を開きます。

ここではプレイヤーの動きとアニメーションとの関連付けを行っていきます。

右クリックして「Add New State Machine…」を選択します。

ノード名を「Locomotion」に変更して、「Output Animation」に繋ぎます。

「Locomotion」をダブルクリックすると下の写真の画面になります。

「Out」から矢印を引っ張て、「Animation State」を選択し、作成されたノード名を「Idle」にします。

「Idle」をダブルクリックし、画面を移動します。

「Play Idle」ノードを作成して、「Output Animation」に繋げます。

「Locomotion」画面に戻ります。

タブの下に「ABP_Player>AnimGraph>Locomotion>~」とあるので「Locomotion」をクリックすると画面を移動します。

「Idle」から矢印を引っ張て、「Animation State」を選択し、作成されたノード名を「Run」にします。

「Run」をダブルクリックし、画面を移動します。

「Play Run」ノードを作成して、「Output Animation」に繋げます。

アニメーションの流れが出来上がったので、次は条件を設定していきます。

「Locomotion」画面に戻り、「Idle」と「Run」の間にあるマークをダブルクリックします。

「Idle to Run(rule)」画面になるので、下の写真のように処理を組んでいきます。

ここではプレイヤーの速度を取得して、0より大きければ、「Run」アニメーションに移行する処理になっています。

「Run」から「Idle」アニメーションに戻る条件を設定します。

「Locomotion」画面に戻り、「Run」から矢印を引っ張り「Idle」に繋げます。

下の写真のように、「Run」から「Idle」に向かう方のマークをダブルクリックします。

「Run to Idle(rule)」画面になるので、下の写真のように処理を組んでいきます。

  • 「Idle to Run(rule)」で配置したノードをコピーして、こちらに配置します。
  • 「>」ノードの結果に「Not boolean」ノードを繋げます。
  • 「NOT Boolean」ノードと「Result」を繋げます。

ここでは先ほどと逆のことを意味する処理になっています。

プレイヤーの速度が0以下なら「Idle」アニメーションに移行します。

アニメーションの向きを設定していきます。

「Anim Graph」画面に移動して、「Locomotion」と「Output Animation」の間に「Set Directionality」ノードを配置します。

このノードは、Inputで入力された値から向きを取得して、アニメーションの向きを変更するために使います。

Inputピンを分割します。

下の写真のように処理を作成します。

  • 「Get Owning Actor」ノードと「Get Actor Forward Vector」ノードを繋げます。
  • 「Get Actor Forward Vector」ノードの「Return Value」ピンを分解して、「X」を「Set Directionality」ノードの「Input X」に繋げます。
  • 「Y」は繋げる前に「-1.0」を掛けた状態の値にしてから繋げます。
    これは、Y軸の正面を今回の2Dキャラクターの正面方向に合わせるためのものです。

「PaperZD AnimBP」の作成完了です。

プレイヤーのブループリントに「PaperZD AnimBP」を設定する

「BP_Player」を開きます。

「Components」の「Animation Component (Animation)」を選択します。

「Details」の「Paper ZD」の「Anim Instance Class」を「ABP_Player」に変更します。

プレイヤー回転を有効にして、アニメーションを変更させるために以下の設定が必要になります。

「Details」の「Orient Rotation to Movement」にチェックを入れます。

「Use Controller Rotation Yaw」のチェックを外します。

「Rotation Rate」の「Z」の値を大きい数字にします。

ここでは、プレイヤーの向きを瞬時に変えたいので大きい値にしています。

「SpringArm」の「Transform」の「Rotation」を「Absolute Rotation」に変更します。

項目の右側の「V」をクリックして、「World」を選択すれば変更できます。

「Sprite」の「Transform」の「Rotation」も「Absolute Rotation」に変更します。

設定できたら保存して、プレイします。

うまくいかない場合ワールド座標のX軸の「赤矢印」が右側に来るようにキャラクターの向きを変更してみてください。

プレイヤーの移動する方向に合わせてアニメーションが切り替わればOKです。

NPCキャラクターにアニメーションを付けたい場合も、同様の手順で作業すればOKです。

今回は、NPCキャラクターはその場で足ふみするだけにしますので、設定はしません。

重要!
レベルの座標方向とキャラクターの座標方向は一致するようにすること。
新しいフィールドを作成する際も、座標方向一致を忘れずに。

アニメーション設定完了

今回はここまでです。

次回は「無料アセットのマップを使用する」です。

前後記事

他の記事を探す

他の記事も気になる方は、以下の記事の目次を確認ください。

タイトルとURLをコピーしました