読者です 読者をやめる 読者になる 読者になる

みつまめ杏仁

アンリアルエンジン(UE4)でGUIを作るためにゴニョゴニョしてます。UIデザイナーの皆様の助けになれば幸いです。

5分で作る マテリアルを使わないゲージ

UE4 UI UMG ゲージ Widget

超簡単お手軽ゲージを作ってみます。マテリアルは使いません。

Widgetブループリントを一つ用意します。

キャンバスに配置するパーツは3つ。

f:id:hiyokosabrey:20161114000006p:plain

ゲージ用のキャンバスとゲージの下敷きは同じ大きさにします。下敷きは暗めの色にしておきます。

ゲージ本体の「Image」をキャンバスの子供にしたら、設定をサクッと変更します。

まずはAnchors(アンカー)を右下のやつに変えたら、

f:id:hiyokosabrey:20161114000321p:plain

すぐ下にあるOffset関連の値をすべて0.0にします。

f:id:hiyokosabrey:20161114000622p:plain

カラーを適当な色にしたら、

f:id:hiyokosabrey:20161114001020p:plain

 

最後にキャンバスパネルの  isVariable のチェックを入れて完成です。

f:id:hiyokosabrey:20161114001028p:plain

 

編集モードをグラフに切り替えて、MyBlueprint のタブから、Function(関数)をひとつ追加します。

中身は以下。

f:id:hiyokosabrey:20161114001531p:plain

コンパイルしてエラーがなければ保存して完成です。

 

レベルから確認してみます。

レベルブループリントを編集します。

f:id:hiyokosabrey:20161114002256p:plain

再生してみると、

f:id:hiyokosabrey:20161114002507p:plain

f:id:hiyokosabrey:20161114002512p:plain

f:id:hiyokosabrey:20161114002518p:plain

スペースキーを押すたびに長さが変化します。

 

完成です。

実際に時計見ながら作ってみたのですが、5分かからなかったです。

 

見た目には安いですが、このスピード感は大事です。

ゲージ一本でゲーム性やバランスが大きく変わるのはよくある話です。

 

ではでは

ステキなゲージライフを!