UE4+LeapmotionのImage情報をマテリアルで使うまで
LeapmotionのImage情報、マテリアルインスタンス使って表示してみた。楽しいこれ! pic.twitter.com/60UijUYb7c
— Toorsoo (@toorsoo) 2014, 12月 6
時間と体力と社会の荒波の間をフヨフヨしてて、試してから少し時間開いてしまったのですが、..('_'=
LepamotionからのImage情報を使って少し遊んでみた感じのメモになります。
トレース…オン!
こういうのも何のコードも一切かかずに出来ちゃいます。すごい時代だ…(困惑)
というわけで、Image情報使う時の参考になれば幸いであります。
UE4でLeapmotionを使うにあたって、引き続きこちらのプラグインを使用させて頂いてます!感謝!
[Plugin] Leap Motion - Event Driven
使用したバージョンはそれぞれ
UE4: UE4.6.1
Plugin: Latest - 0.8.2 (UE4.6, Leap SDK 2.2)
になります。
LeapmotionからImage情報を取得する
まずはImageの取得方法です!
LeapControllerコンポーネントからTexture情報を取得したいと思います。
手順はこんな感じです。
①Image情報を有効にするノードを呼び出す。
②LeapControllerコンポーネントからTexture情報を引っ張ってくる
具体的な処理はこちらのブループリントをどうぞ!↓
①Image情報を有効にするノードを呼び出す。
EnableImageSupport ノードでImage情報の使用を有効にします。
CostructionScript、BeginEventアクションなど、
任意のタイミングでこちらのノードを呼び出します。
②LeapControllerコンポーネントからTexture情報を引っ張ってくる
LeapControllerからTexture情報取得までの流れ
LeapController -> Frame -> Images -> Image -> Texture で取得できます。
何度かImage情報の取得失敗?(存在しないインデックスの配列参照)で落ちる事があったので、
NULLチェックはあった方がいいかもしれないです!
これでこういったモノクロのImage情報が取得できます。
ここまで綺麗なモノクロTexture…、マテリアルで色々遊べちゃいそうですね。
なのでマテリアルに渡してみたいと思います!
LeapのImage情報Textureをマテリアルに渡す
マテリアルインスタンスを使ってTexture情報をマテリアルに投げるまでの流れになります。
ざっくりな手順としては
といった感じになります。
まずはマテリアルの作成からやってみます!
Leapmotionのイメージを反映させるマテリアルを作成
まずはこういった↓手だけを抽出したようなものを作ってみます。
手の抽出にはMaterialのBlendMode、Maskedを使い、
オパシティマスク値にLeapのImage情報を適応させる事で、一定以上の明るさがある部分のみを表示させています。
テクスチャのパラメータを追加し、オパシティマスクに繋ぎました。
(上で設定しているテクスチャそのものは仮のものです。)
このテクスチャパラメータにLeapmotionのImage情報を渡していくことになります。
このマテリアルを元にして、
次はテクスチャパラメータ更新用のマテリアルインスタンスを作成します。
マテリアルインスタンスを作成
マテリアルインスタンス…?
Unreal Engine | インスタンス化マテリアル
> アンリアル エンジン 4 では、 2 種類のマテリアル インスタンスを利用できます。
> Material Instance Constant - 実行前にのみ計算されます。
> Material Instance Dynamic - 実行時の計算 (編集も) が可能です。
こちらのMaterial Instance Dynamicを使い、さきほど設定したテクスチャパラメータの値をLeapmotionのImage情報に更新をかけると言った流れです!
マテリアルとコンテンツブラウザ上から右クリックでマテリアルインスタンスを作成します。
パラメータグループに先ほどマテリアル側で設定したテクスチャパラメータが表示されるので、
チェックボックスにチェックを入れます。
マテリアルインスタンスにLeapからのTextureを反映
次はブループリントで作成したマテリアルインスタンス経由でマテリアルへとTexture情報を更新する処理です。
まずはMaterialInstanceDynamicの変数を追加します。
次にCreate Dynamic Material Instance ノードで追加したMaterialInstanceDynamicの変数にインスタンス化した値を入れます。
Parentには先ほど作成したマテリアルインスタンスを指定します!
あとは Set Texture Parameter Value ノードを使い、毎フレームマテリアルインスタンスのテクスチャ情報を更新してやります。
これでマテリアルにLeapmotionのImage情報は渡せました!
あとは適当にカメラの前に板ポリを置いたりして……
置いた板ポリのマテリアルをさっきのマテリアルインスタンスに変更したりすると、
↑のような手だけ抽出されたようなImageが表示されます!
余談ですがこんな遊び方もできちゃうっぽいです。きれい。
UE4+LeapMotion+image - YouTube
トレース……オンッッッ!!!!(3回目)
Fate最高ですFateもうエフェクトとか背景とか毎週ため息出るくらいのクオリティでもう最(略
色々マテリアルで遊ぶと冒頭のこんな感じのものもできます!!
上でやってる事はかなり単純で、適当な基盤のテクスチャで更にマスクをかけて、
エミッシブに強めの色を指定してる感じです。
Fate見終えてテンション上がって勢いだけで作っただけとは言えない……
というわけでLeapmotionのImage情報をマテリアルで使用するまでの流れでした!
UE4Study(#3)とAdventCalendarの記事のおかげで最近マテリアルで色々出来るようになって来た!
スゴイありがたい……('ω` )