single.php

UEでイベントグラフから画像を回転させるマテリアルの作成手順

Unreal Engine 5で開発する過程で、イベントグラフから画像を回転させるマテリアルの作成手順を備忘録的に投稿します。

パラメータで画像を変更するマテリアル

イベントグラフで、後から画像を動的に変更するためにパラメータを使って設定が可能なマテリアルが作れます。

1.[マテリアル]を作成して[M_UI_Rotator]などの名前に変更します。

2. イベントグラフに追加されているノードを選択して[詳細]画面で[Material Domain]を[User Interface]に変更します。

背景透過の画像を使う場合には[Blend Mode]を[AlphaComposite]に変更します。

3.[TextureSampleParameter2D]ノードを追加して名前を[UITexture]にします。

4.[RGB]ピンと[最終カラー]ピン、[A]ピンと[オパシティ]ピンを接続します。(背景透過を使う場合には、下の画像のように[Multiply]ノードを追加します)

5.[Rotator]ノードを追加して、[Speed]設定を[1.0]に変更します。([Center X]と[Center Y]は回転させる中心点です既定では中心を軸に回転します)

6.[Rotator]ノードの[Time]ピンから[ScalarParameter]ノードを追加して名前を[RotatorAngle]にします。

7. 画像を使うウィジェットの[デザイナー]画面で[Image]の詳細画面で[Brush|Image]に作成したマテリアルを選択します。(後でアクセスしやすいように[Is Variable]のチェックを付けておきます)

8.[イベントグラフ]の[Constuct]イベントで[Set Dynamic Material]ノードを追加して[Return Value]ピンを変数として保存します。

9. 保存した変数から[Set Scalar Parameter Value]ノードを追加して[Parameter Name]にマテリアルで追加した[RotationAngle]の名前を設定し[Value]には回転する角度を入力します。(入力する角度は、0~360ではなく0~1になるように変換します)

10. 実際に[Set Scalar Parameter Value]に角度を入力する場合には[Degree To Radian]ノードが使えます。(Float型で0~360度の角度を入力すれば変換してくれます)

実行すると[Set Scalar Parameter Value]で設定した角度で画像が回転して表示されます。

まとめ

今回は、短い記事ですが、Unreal Engine 5でイベントグラフから画像を回転させるマテリアルの作成手順ついて書きました。

パラメータで変更可能な[マテリアル]を用意することで、実行時に角度を指定してテクスチャーの表示が可能です。

Unreal Engine で実行時に動的に画像を回転したい人の参考になれば幸いです。

スポンサーリンク

最後までご覧いただき、ありがとうございます。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です