UE4 マリオオデッセイみたいなHPゲージを作る

はじめに

今更ながらマリオオデッセイをプレイしてみて作りたくなったので、こんな感じのやつを作っていく。
youtu.be

オパシティマスク用のテクスチャを用意する

テクスチャサイズは自由ですが、テクスチャの中心から外周・内周までの半径の比率だけ決めておくと良いです。今回は1.0：0.8にしてあります。決めておかないと、マスクが大きすぎてHPゲージが表示されないなど、後々で困ります（困りました）。あとは、CompressinのCompression settingsをMasksにするのを忘れずに

HPゲージのマテリアルを作る

MF_CircleTop

TextureCoordinateのTilingをU・Vともに2.0にする。

M_HP①

HPゲージの色のついた部分の表示領域の調整です。テクスチャでマスクをかけるので、マスク領域にあった表示領域に調整してください。テクスチャを用意するときに決めた比率で設定すれば表示されると思います。

M_HP②

最後に、今回はUIで使うのでマテリアルのMaterialDomainをUserInterfaceに、BlendModeをMaskedにする。

BPからHPのパラメーター操作する

Beginplay

PlayerController側にWidgetとDynamicMaterialInstanceの変数を用意し、GetDynamicMaterialでHPのマテリアルを取得する。

Set HUD HP

HP設定用のパラメーターは0～1.0で、減った量である背景色（グレー）の割合を設定しています。 HPが0なら1.0、1なら0.67、2なら0.33、3なら0.0。 HPは0～3なので、1.0からHPを3で割った数値を引いた値をSetScalarParameterValueに渡しています。

動画

参考記事

ai-gaminglife.hatenablog.com
pafuhana1213.hatenablog.com
limesode.hatenablog.com