僕の私のUnrealな日々

UE4のBluePrintを使って小さなギミックを作ったりしてます。ブログを通じて情報共有ができたらなと思います。

UE4:オブジェクトのアウトラインをM_Highlightを使って光らせる。

オブジェクトのアウトラインを表示するマテリアルが公式で配布されているContentExampleの中にありまして、非情に使い勝手がいいので使い方をまとめておこうと思います。(自分がすぐノード名とノード構成を忘れちゃう

 

f:id:Bussan_dayo:20150501225833p:plain

 今回は画面の中心部にオブジェクトが当たったらアウトラインが光るようにしたいと思います。

 

今回やること

画面の中心部にオブジェクトが当たると外枠が光るようにする。

一つ一つ光るようにする。

外枠の幅を太くする。色を青に変える。点滅を早くする。。

 

つまりこういうことです。

 

 

 

使用するもの

FirstPersonテンプレート

M_Highlight(ContentExampleから)

使用するレベル

Minimal_Default (StarterContentのMapから)

 

 エディタ側

 まずContentExampleから「M_Highlight]を持ってきます

f:id:Bussan_dayo:20150501221308p:plain

 移行を選択し作成したプロジェクトのContentに移動します。

 

 

 

次にPostProcessを設置します。

f:id:Bussan_dayo:20150501221724p:plain

 

 

PostProcessの詳細欄を開きMiscのBlendablesの+をクリックします。

そして移行したM_Highlightをドラッグアンドドロップで持っていきます。

f:id:Bussan_dayo:20150501221956p:plain

 

ブループリント側

次にFirstPersonCharacterのブループリントを開きます。

イベントグラフでノードを設置していきます。

 

まず、イベントTickを設置しLineTrace by Channelに繋げます。

そしてStartとEndを以下のように繋げます。

f:id:Bussan_dayo:20150501222427p:plain

 

カメラからスタートしてカメラ前方の位置から1000かけた位置をEndとすることが出来ます。

 

デバッグモードで見てみると

f:id:Bussan_dayo:20150501222604p:plain

こんな感じ

 

次にReturnValueからブランチを出し、OutHitからBreakHitResultを出します。BreakHit ResultのHit ComponentからStaticMeshComponentをキャストするを出します。

f:id:Bussan_dayo:20150501222902p:plain

 これで赤い点がStaticMeshCompornent(今回は椅子とか床とか)に当たった時に行いたい動作が起こるように出来ます。

 

次にSet Render Custom Depthノードを出します。

ターゲットをキャストしたAs Static Mesh Componentに繋げます。そしてValueにチェックを付けます。

 

f:id:Bussan_dayo:20150501223837p:plain

 

すると外枠が光るようになります。

 

が、これだと作ろうとしている画面の中心に当たったオブジェクトのみ外枠が光るようにすることが出来ません。

f:id:Bussan_dayo:20150501223939p:plain

全部光っちゃう。(わかりずらいけど光ってます。

 

なのでBluePrintを組み替えていきます。

 

まずAs Static Mesh Componentから線を出し変数を作成します。今回は名前をHit Componentにしました。これをGetで一つ持ってきます。

f:id:Bussan_dayo:20150501224344p:plain

 

次にIsValidノードを設置します。このノードはInput Objectがレベル上に存在しているかどうかを判定するノードです。

 

そこでIs validにSet Render Custom Componentを繋げます(チェックを付けない)。そしてIs Not Validから先ほど作ったHit Component(Set)に繋げます。そしてもう一つSet Render Custom Depthを設置します。(チェックをつける)。

f:id:Bussan_dayo:20150501224857p:plain

 

すると、一つ一つ光るようになります。

 

 

光ってるかわかりづらい・・・ 

 

非情に悲しいので太さ、色、そして点滅スピードを変えていきます。

 

マテリアルをいじる

マテリアルの全体像を見るとこんな感じなんですが、画像の1が枠の太さ、2が色、3が点滅を設定できるところになります。

f:id:Bussan_dayo:20150501225152p:plain

 

 

1 太さを変える。

Line Render Widthの数値を4にします。

f:id:Bussan_dayo:20150501230903p:plain

 

 

すると太さが変わりますf:id:Bussan_dayo:20150501225749p:plain

 

2 色を変える

f:id:Bussan_dayo:20150501225814p:plain

 

 

すると

f:id:Bussan_dayo:20150501225833p:plain

色が変わった!!

 

3 点滅スピード

Timeの隣にあるSinの数値を1にします。(数値が大きいと遅くなり小さいと早くなります)

f:id:Bussan_dayo:20150501230210p:plain

 

 

 

になります。

 

 

これで以上です。

ノードの全体図としてはこんな感じです。

f:id:Bussan_dayo:20150501231126p:plain

 

 

これを使うと、

 

こういったよに使用することが出来ます。(クソゲーでもちょっと栄えますね

 

 

公式で配布されてるプロジェクトの中にこういったものがあるって素敵ですね。

 

 

以上。

 

 

なんか分かりづらかったらすみません。