目次
はじめに
前回の続きです。
▼この記事でできること
解説
①HUDUIの作成
ウィジェットブループリントからWBP_HUDを作成します。
Ap●x感のある透過画像をペイントソフトで作成します。
imageを組み合わせてAp●x風のUIを作成します。
武器背景は３枚を組み合わせています。
選択したものには編集可能にするためIs Variableのチェックを入れます。
②表示してみる。
BP_FirstPersonCharacterのイベントグラフを開きます。
BeginPlayに作成したウィジェットを表示するようにします。
ItemInfoの後に表示することで武器情報より上に表示されます。
実行してみましょう。
それっぽい感じになってきましたね！
③クロスヘアのスケールと切替
某ゲームでは武器を持っていない状態では丸いクロスヘアで武器を装備するとクロスヘアに変化します。また移動中はクロスヘアが広がり立ち止まると小さくなります。この変化を実装してみます。
WBP_HUDを開きます。
イベントグラフからカスタムイベントChangeCrosshairを作成します。
インプットからテクスチャーを変更するシンプルなモノです。
次にスケールを変更する関数、UpdateCrosshairScaleを作成します。
MapRangeClamped
Valueに入力された値をInRangeの範囲で割合を計算してOutRangeに変換する。
例 Value 0.5 inA 0 inB 1 outA 0 outB 100 // Return 50
BP_FirstPersonCharacterのイベントグラフを開きます。
BeginPlayに追加してクロスヘアをCircleにします。
Grabイベントの前にも追加します。
武器チェンジにも追加します。
Tickノードからアクタの加速度をウィジェットの関数に流します。
実行して武器を装備するとアイコンが変化して、移動するとクロスヘアのサイズが変化することを確認しましょう。
inRangeBを小さくすると感度が上がります。
OutRangeBの値を変更するとスケールを変更できます。
④武器情報の更新
ウィジェットを設定します。文字とグレーの背景のZOrder（奥行）を5にして手前に表示します。
WeaponIconBack_P,SのZOrderを1,-1でこのように
-1,1でこのように透過グレーを挟むことで見栄えを調整します。
カスタムイベントUpdateWeaponInfoを作成します。
配列から対象の武器の情報を取得します。
名前の変更
背景色変更
OverrideIconBackで分岐しZOrderを変更します。
射撃モードはテキストで表示しました。
アイコンを設定します。
Clearが有効なときは何も書いていないアイコンを表示します。
背景色の変更です。
某ゲームでは銃の種類の色ですが、構造体に持っていないのでレアリティの色を反映させてみました。
アイコンの変更
情報を初期化するイベントを作成しておきます。InitInfoとしました。
最後にBP_FirstPersonCharacterへ実装します。
▼BeginPlay
▼Grab
▼武器チェンジ（キー）※CurrentWeaponNumberを追加しています。
▼武器チェンジ（ホイール）※CurrentWeaponNumberの位置を移動しています。
実行してみましょう。
武器を切り替えるとHUDが更新されれば成功です。
最後に
UE4やUE5向けの記事を書いています。
皆様の応援が投稿のモチベーションになりますので
コメントやTwitterのフォローなどしていただけるとありがたいです。
それではよきゲーム開発を。
