【NeosVR LogiX】マテリアルの色をNodeで変更してピカピカさせてみる

#はじめに
マテリアルをピカピカさせるNodeをいくつか作ったので紹介します。

#参考
[公式チュートリアル動画](https://www.youtube.com/watch?v=rQMeL6hXBU4&list=PLoAvz0_U4_3zkwJQWd8eD8TWyQ0_0JWnw&index=7)

#準備
まずDevToolTipを装備して[Create new...]を選択します。
![2019-12-30 22.04.13.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/94f4e279-83df-4d8a-25b9-48e8fbd882d4.jpeg)
その後は、[3D Model]→[Box]の順に選択していけばCUBEが生成されます。
生成されたCUBEはセカンダリボタンを押して選択し[Open Inspector]を選択してInspectorを表示させます。
![2019-12-30 22.06.44.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/aa6aeeb5-aee3-17c4-1d04-43cde5bb4bc9.jpeg)

Inspectorが開けたら、LogiXTipに切り替えてマテリアルにカーソルを合わせてグラブした状態でセカンダリボタンを押します。
セカンダリボタンを押した後にパラメータ一覧のオブジェクトが表示されます。
![2019-12-30 22.17.25.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/d24cfd21-d5b7-3912-70b7-59ea491d106a.jpeg)

これで準備はいったん完了です。

#ピカピカさせる

![2019-12-30 22.23.18.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/47f7ce43-633c-16bc-f805-3aebb30d58b3.jpeg)
Sin関数を利用して値が0より大きいなら赤。0未満なら青という切り替えを行っています。

[Input]→[T] 時間を取得
[Math]→[Sin]　Sin関数
[Operators]→[>] 値の大小判定に使用
[Operators]→[?:] 参考演算子。3つ目につないだ線がtrueなら上が出力されfalseなら下が出力される。


![無題.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/3a21ee67-11da-138f-0b6b-c0dd25c20526.jpeg)

点滅の速度を調整したい場合は[T]と[Sin]の間に[X]を追加します。
[Operators]→[X] 2つの入力を乗算して出力する。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">マテリアルをピカピカさせる。 <a href="https://t.co/hDs3c5KgMk">pic.twitter.com/hDs3c5KgMk</a></p>&mdash; 駒芝 (@komashiba33) <a href="https://twitter.com/komashiba33/status/1211679520366874624?ref_src=twsrc%5Etfw">December 30, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 

#じわっと変わるようにする
![無題.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/280bc8c6-0d23-8575-61a6-131bf435c582.jpeg)


Sin関数で出力された値を0～1の値にして赤と青の色を混ぜ合わせています。

[Operators]→[÷] 除算
[Operators]→[1-X] 1から入力された値を減算

<blockquote class="twitter-tweet" data-conversation="none"><p lang="ja" dir="ltr">じわっと変わるようにする。 <a href="https://t.co/DmXMsDtNoo">pic.twitter.com/DmXMsDtNoo</a></p>&mdash; 駒芝 (@komashiba33) <a href="https://twitter.com/komashiba33/status/1211679752383188993?ref_src=twsrc%5Etfw">December 30, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 

#Checkboxの出し方
Checkboxの出し方はDevToolTipを装備してメニューを開き[Create new...]→[Object]→[Neos UI]→[Checkbox]で作成できます。
Inspectorを開いてLogiXTipに切り替え。NeosCheckboxにカーソルを合わせてグラブした状態でセカンダリボタンを押すとパラメータが表示されます。
![2019-12-30 23.50.06.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/ebb58a8a-eb34-7914-5ff5-3d6efb67c1a8.jpeg)


#Checkboxで変わるようにする
![2019-12-31 00.00.15.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/98ba8a9f-0c11-5656-678e-a8bfd88c56de.jpeg)

チェックボックスの値が変更されたらパルスが走るようになっています。
パルスが走った際に、trueかfalseかを判定し青色にするか赤色にするか判断しています。

[Flow]→[Fire On Change] 値に変化があった場合にパルスが走る
[Flow]→[If] trueなら上のパルスが走り、falseなら下のパルスが走る
[Actions]→[Write] 指定されたValueに値を書き込み
[Variables]→[Color] Color型の変数

![2019-12-31 00.01.27.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/558347/abc02846-d3cb-283d-dfa6-86113360f2ba.jpeg)

色をじわっと変化させたい場合はSmoothLerpを使用すると便利です。
[Math]→[SmoothLerp] 値を補間してくれるノード。下の値が小さいと変化までに時間がかかる。

<blockquote class="twitter-tweet" data-conversation="none"><p lang="ja" dir="ltr">Toggleボタンで切り替え。 <a href="https://t.co/SL8dZ3Qmp0">pic.twitter.com/SL8dZ3Qmp0</a></p>&mdash; 駒芝 (@komashiba33) <a href="https://twitter.com/komashiba33/status/1211680066888859650?ref_src=twsrc%5Etfw">December 30, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 


#最後に
色々と模索しながら書いてますのでわかりにくい所があったらすいません。
まだ触ってないノードも大量にあるので遊びながら覚えていこうと思います。