【UE4】UMGを使わずに残弾数表示(AmmoCounter Without UMG)
はじめまして
ゲーム会社でエフェクトアーティストやってます
今までYOUTUBEでたくさん勉強になったのでこれからは自分からも情報を発信していこうかと思います。(たぶん・・・っ!
まず第一弾として
FPSでよくある銃の残弾数の表示をマテリアルとBPでやってみようというものです
UMGには制限が多くマテリアルで遊ぶことがなかなかできません
ならもうマテリアルで表現してしまおうというものです
最終的にこんな感じになります
では始めましょう
とても長いですがお付き合いください
まず新規でFPSのテンプレートから始めた状態で解説します
初期弾数を30発の設定で今回はいきます
いきなりすんごい縦長の画像で申し訳ないですが
128x2048で好きなフォントでこのようにテクスチャーを作ります
0からはじめると後々楽です
しっかりガイドを引いて数字の中心を合わせることが大切です
そしてマテリアルパラメーターコレクションを作成してこのように設定します
次にマテリアルを新規で作成してこのようにノードを組みます
わかんねぇよって人に拡大画像を
まず10の位の画像
・Ten_X_TillingSource
テクスチャーのX方向のタイリングです 今回は使用していません
・Ten_Y_TillingSource
テクスチャーのY方向のタイリングです
数字が10個あるので0.1にすると画像が拡大されて数字が1つだけの状態になります
・X_Tilling
残弾数の数字の横幅を調節できます
・Whole_X_Offset
残弾数の数字全体のX方向のオフセット値です
・Whole_Y_Offset
残弾数の数字全体のY方向のオフセット値です
・Ten_X _Offset
10の位の数字のオフセット値です
'Ten_Y_Offset'
ここに先程つくったマテリアルパラメーターコレクションを置いて
このように設定します
次に1の位
10の位とほぼ同じで
マテリアルパラメーターコレクションの違いだけです
このように設定します
あとはそれぞれLerpで数字をアルファ抜きして
Lerpで合成します
水色入っているのはちゃんと抜けているか確認するためのテストです
マテリアルの設定ができましたので
そのマテリアルからインスタンスマテリアルを作成します
そしてこのように設定します
まぁここは個人の好きなように調整してもらったらいいです
さぁBPに行きましょう
FPSのテンプレートから始めているのなら
このFirstPersonCharacterを開きましょう
ビューポートの画面です
コンポーネントのタブでFP-Gunの子供に平面を追加してこのように配置します
マテリアルには先程作ったインスタンスを置いておきます
次にイベントグラフで変数を2つ追加します
まずFloatの型で名前を「MaxAmmo」にします
これは初期弾数である30発を設定しましょう
もう1つもFloatの型で名前を「CurrentAmmo」にします
これは1発ずつ減っていったときの弾数を取得する用のものです
マウスをクリックするたびに弾が減るようにしたいので
Fireのインプットからこのようにします
AutoFireのマクロが挟まれているけどなくても動くので気にしないでください
(Tickノードを挟まずにクリックしている間連続で発射されるようにしているマクロです)
CurrentAmmoをゲットし引き算で1を引きます
そしてそれを再びCurrentAmmoにセットします
これは現在の残弾数にクリックごとに1を引きその結果を残弾数に設定するということです
そのあとに「カスタムイベントを追加」し名前を「Ammo Calculate」とします
これはクリックしてこのイベント先に処理が飛ぶようにしています
これは後に解説します
次にBeginPlayのノードからプレイ開始時の弾数の設定をさせます
青色のノードは
Create Dynamic Material Instanceを配置して先程作ったインスタンスマテリアルを
SourceMaterialに設定し一番右にSetScalarParameterValueをつなぎパラメーターコレクションを設定してパラメーター名を設定します
するとBPでマテリアルの数値をいじれます
SequenceのThen0では初期弾数設定をしています
MaxAmmoをCurrentAmmoとして数値を代入させます
Then1のところは10の位を取得する計算をしています
ここからめんどくさい数学の時間です
10の位を初めの方で作ったマテリアルパラメーターコレクションに数値を代入させるよう計算します
0.1では数字の1が表示されます
例えば27発では10の位の2だけを取りたいので
まずCurrentAmmoを10で割り算します
すると2.7になりますね
ここで0.7が邪魔なので最小の整数を取得するFloorを使います
すると2.7→2.0になります
それで最終的に0.2という数字がほしいので10で割ります
しかし残弾数が1桁担った場合の10の位は常に0にしないといけません
その処理も組む必要があるので
不等号で0より上の場合はTrueになり数値が代入され
0より下の場合はFalseで0の数値が代入されるようにブランチで処理します
これで10の位の初期設定が完了です
次は1の位です
1の位はもっとややこしくて
先程の例で行くと27発の場合
1の位は7ですね
まず残弾数を100で割ります
すると0.27になります
次に10の位の2の部分をなくしたいので
27を10で割ります
すると2.7になります
最小の整数を取得するためFloorを使います
それをさらに10で割ると0.2になります
先程の0.27から0.2を引くと0.07が残ります
7を表示させるには0.7にしないと行けないので10をかけます
また1の位が0の場合の処理も組まないといけないので
不等号とブランチで10の位と同じように処理をさせます
これで初期設定は完了です
上の方で作ったカスタムイベントを受け取りさきの処理を設定します
右クリックを押してカスタムイベントでつけた名前で検索するとAmmoCalculateがあるのでそれを配置します
Then0の処理ですが
クリックごとにAmmoCalculateのイベントが発生するようになっていますので
1発減るごとに数値を取得するように組んでいます
処理的には初期設定のときに使った処理と同じです
これでBPの設定は完了です
プレイボタンを押して撃ってみましょう
数字が1つずつ減っているはずです
今回の処理では弾が0になってもマイナスの数値が入っていくので
クリックするたびまた数字が増えていくようになっています
それはCurrentAmmoが0以下になると撃てなくなる処理をブランチで組むことで解決します
あとはマテリアルでいろいろ遊んでみてください
1発目から超長い記事になりましたがまたいいネタがあれば更新します
ではー