社員技術ブログ

Unreal Engine 5 (UE5) マウスドラッグに合わせてオブジェクト(コンポーネント)を回転させるプログラム

おはこんばんすみ。ミデンです。
今回はマウス操作で回転するオブジェクトのプログラムを作っていきます。
マウスドラッグに合わせて~というようにマウスをドラッグしたときのカーソルの動きに沿って回転する仕組みを考えました。

マウス座標を角度に変換

ブループリント

まずはベースとなるブループリントです。
マウスドラッグで回転を行う為には画面のカーソル座標から角度を取得する必要があります。
その処理を下の画像のように作成しました。

Fn Get Degrees 関数
Get Mouse Positionで取得したカーソル座標をDeproject Screen to Worldでワールド座標と方向ベクトルに変換し、それを元に角度計算用のメッシュコンポーネント(Plane)に対してLine Trace Componentを行います。
そして、ヒットした座標をInverse Transform Locationでコンポーネントのローカル座標に変換、Atan2関数を使ってそのコンポーネントの中心に対する角度を計算しています。

こちらがイベントの全体です。

BeginPlayイベント(上段)でカーソルの表示、
MouseButtonイベント(中段)で角度計算を行うTickイベントのオン・オフを切り替え、
Tickイベント(下段)で角度計算と表示を行っています。

プレビュー

実行するとこのようになります。

赤い四角の中心がカーソルの位置で白線で示したようなメッシュの中心からの角度(奥が0° 手前が±180°)を取得しています。

マウスのドラッグ操作でオブジェクトを回転させる

次にこのベースを使ってハムスターの回し車を作ってみます。
こちらがイメージ図です。

マウスドラッグで回し車が回転します。

コンポーネント

コンポーネントの構成はこちら。

横倒しの角度取得用の円柱(「Cylinder」 非表示)と回転用(回し車のメッシュ「SM_Wheel 」表示)で別々に用意しています。
ローカルの軸で物理シミュレーションさせるために Physics Constraint を使用しています。(もっとスマートな方法がある気がします・・・)
Physics Constraint の設定はSwing 1 Motion をFreeにし、それ以外をLockしています。

イベント

イベントもTick部分に変更を加えています。

上段で角度を取得して前フレームとの差分を取ります。(Fn Get Degrees 関数の「Plane」を「Cylinder」に変更しています)
初回時など差分が正確に取れない時のスキップ処理も追加しておきます。
下段では±180の境界を跨ぐ際に差分が不正確になるのでDelta Rotatorを使い正規化、スケールして向きを合わせてAdd Torque in Degreesに渡します。
最後に速度を1以下にスケールすることで、マウスを動かさないことで停止できるようにしました。

以上で今回のブログはおしまいです。
ありがとうございました。

あ、どすこい。

関連記事

TOP