【VRChat】VRC_TriggerのSetMaterialで色変えギミックを作る

#はじめに
VRChatワールド『[mellow frame](https://vrchat.com/i/cable-benchrelish-a3e71)』のギミックを作るメモです。
ミラーのOnOffなどのちょっとしたギミックを扱ったことがあり、そこからもっとギミックを作ってみたいという方でしたらなにか参考になるかもしれません。
無駄や間違いが含まれている可能性がありますので、ご指摘いただけるとありがたいです。

思想編は[note](https://note.com/masaki_nire/n/nfeee02ce908e)へ


###環境
unity: Unity 2018.4.20f1
VRCSDK2: 2021.02.23.11.41

#どんなギミック？

https://youtu.be/EWNUUkKMZ0w

マテリアルオブジェクトでパネルに触れると、ワールドオブジェクトの色を変えることができます。

これはVRC_TriggerのOnEnterTriggerを利用しSetMaterialを発動させ、パネルとワールドオブジェクトのマテリアルを連動して変更させています。
つまり、コライダー同士が接触したときに片方のマテリアルを変更するという遊びです。

#用意するもの

- マテリアルオブジェクト
- パネル
- ワールドオブジェクト
- マテリアル16種

#作り方
##1.モデリング
色を変えられる部分はケーキ+お皿の合計10層です。そのためモデリングの段階でオブジェクトを分けておきます。
![210319_02_1-1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/9e9f1dcf-279b-3c4b-4881-83f93ccb8fe1.jpeg)
![210319_02_1-2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/2bd222bd-aa5d-999f-0a41-d40674a441c6.jpeg)


##2.unityの準備
![210319_02_2-1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/e3ab9f5d-93da-7b47-fc23-4970fbeac28b.jpeg)
ギミック用にレイヤーを10層設定します(画像のように対応させます)。
マテリアルを16種作ります。

##3.モデルの準備
コライダーを付与し、Is Triggerにチェックを入れておきます。
パネルとワールドオブジェクトの初期のマテリアルを設定しておきます。

##4.マテリアルオブジェクトの設定
![210319_02_4-1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/745ae848-3ae0-682e-062d-6679faee8f21.jpeg)
[VRC_Pickup]を付与します。AutoHoldをyesにするとデスクトップモードのときラクです。
空中で静止させたいので[Rigibody]のUse Gravityはチェックを外し、Is Kinematicにチェックを入れます。
レイヤーはPickupにします(VRC_Pickupを付与すると自動的に設定されます)。
[VRC_Object Sync]を付与します。

![210319_02_4-2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/c76ccf42-eb61-3f93-ed18-57262408fbba.jpeg)
[VRC_Trigger]を付与します。
◇OnEnterTrigger→AlwaysBufferOne
◆Layers: (上から1層目)
◇Actions: SetMaterial
◆Receivers: (パネルとワールドオブジェクトの上から1層目)
◇Material: (このマテリアルオブジェクトの色)

同じ[VRC_Trigger]のなかに10層分設定します。◇は固定、◆はそれぞれ変えてください。

さらにマテリアルオブジェクトの数だけこの設定をします(Hierarchy部分。今回は16種)。最後のMaterialはそれぞれの色を設定してください。

##5.パネルの設定
![210319_02_5-1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/e4fb900a-2571-7184-1fc3-34d255cb0513.jpeg)
◆各オブジェクトにそれぞれの層のレイヤーを割り当てます。

[VRC_Trigger]を付与します。
◇OnEnterTrigger→AlwaysBufferOne
◇Trigger Individuals: チェックしない
◇Layers: Pickup(どのレイヤーから影響を受けたいか)
◇Actions: SetMaterial
◆Receivers: (パネルとワールドオブジェクトの上から1層目)
◇Material: none
分けたオブジェクトごとに設定します(Hierarchy部分。今回は10層)。◇は固定、◆はそれぞれ変えてください。

##6.ワールドオブジェクトの設定
![210319_02_6-1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/727540/a3dff341-0c91-1206-87ba-03dc9dc34394.jpeg)

◆各オブジェクトにそれぞれの層のレイヤーを割り当てます。

[VRC_Trigger]を付与します。
◇OnEnterTrigger→AlwaysBufferOne
◇Trigger Individuals: チェックする
◇Layers: Pickup(どのレイヤーから影響を受けたいか)
◇Actions: 設定しないでおく
分けたオブジェクトごとに設定します(Hierarchy部分。今回は10層)。レイヤーのみそれぞれ設定してください。


#Componentの設定を一挙にするには
マテリアルオブジェクトの場合
1つだけ設定したものをコピペする。この記事では“同じ[VRC_Trigger]のなかに10層分設定します”の後です。

パネル,ワールドオブジェクトの場合
Hierarchyでオブジェクトを複数選択し、Add Componentをするとできます。

#課題
Componentの設定が面倒→アイテムが増えたときの設定が手間です。カスタムトリガーを使うといいのだろうと思います。UIとロジックの分離というやつですね……

ワールドオブジェクトに触れても色が変わる→そもそもワールドオブジェクトに[VRC_Trigger]がいらないのかと思ったがなくても発生する。
#参考(順不同)

- [VRChatで棒に触ると反応して声を上げるモブを作るチュートリアル](https://toumoro2.hatenablog.com/entry/2018/08/11/182511)
- [VRC_Trigger - VRChat 技術メモ帳 - VRChat tech notes](https://vrcworld.wiki.fc2.com/wiki/VRC_Trigger)
- [【VRChat】イワシと学ぶVRC_Trigger 基礎編](https://docs.google.com/presentation/d/1nJFOWV-ELBm1zD86KMVT0-OULyAhnTHm298thIgZCm4/edit#slide=id.g5ceb6fab3f_0_41 )
- [index - Programming in VRChat](http://vrcprog.hatenablog.jp/entry/blog-index)
- [【VRChat】VRC_TriggerのActions一覧](https://qiita.com/segur/items/a4520ef31ddaf9c18f87)
- [VRChatワールド用ギミック「BiroPen」](https://booth.pm/ja/items/1645233)
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">通常は作成できないひとつのコライダーのOnEnterTriggerでレイヤーごとに違うアクションが設定できた <a href="https://t.co/qZwz5bXbqE">pic.twitter.com/qZwz5bXbqE</a></p>&mdash; 自立 (@zi_zi_neet) <a href="https://twitter.com/zi_zi_neet/status/1032868705611345921?ref_src=twsrc%5Etfw">August 24, 2018</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">1. マテリアル変更用スイッチのオブジェクトを作成<br>2. VRC_Trigger コンポーネントを付与<br>3. Advanced Mode にチェックを入れる(青枠) ※もしかすると不要かも<br>4. 実行タイミングを OnIntaract に設定する(緑枠)<br>5. Actions に [Basic Events]&gt;[SetMaterial] を追加(紫枠) <a href="https://t.co/noVqUDlU5J">pic.twitter.com/noVqUDlU5J</a></p>&mdash; しいたけ (@vrctaki) <a href="https://twitter.com/vrctaki/status/1206629411631456257?ref_src=twsrc%5Etfw">December 16, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>