Unity5.3でTrail Rendererの軌跡の色を七変化させたかった話。

この記事は、[岩手県立大学 Advent Calendar 2015](http://qiita.com/advent-calendar/2015/ipu)の25日の記事です。
[岩手県立大学 Advent Calendar 2015](http://qiita.com/advent-calendar/2015/ipu)も最終日ですね。

皆さん。12/25ですね。

「ゆうべはおたのしみでしたね」？

![dq1](http://www014.upp.so-net.ne.jp/ricewood/DQ1.gif)

僕は、友人から「あなたの知り合いは、みんな私のセフレなのよ」的な発言を聞いて以来(聞いたのは、けっこう前ですが)、しばらくそういうのはいいかなと思っております。
>さんぺーの「わたしは付き合った人より、やっちゃった人の方が多いです」という一文が目に飛び込んできたとき、そしてそれをエリーに問いただすと「みんなそうだから」と逆にたしなめられたときに、マネジメントの難しさを知りました。
[(上司にしたい上司になるために意識するべき10のこと)](http://liginc.co.jp/life/business/177543)

はい！掴みはバッチリですね！
　  
春からゲームエンジニア(クリエイター？)なので、さいきんは[Unity](http://japan.unity3d.com/)でゲーム作成をしてたりします。
[Unity](http://japan.unity3d.com/)は、いまや有名ツールなので説明は省きますね。

公式サイト:[Unity - Game Engine](http://japan.unity3d.com/)

[Unity](http://japan.unity3d.com/)は、日本語ページがしっかりあったり、公式リファレンスも英語版とほぼ同じ内容で翻訳までされているので、そこそこ初心者にも優しい環境なのではないかな思っています。

そんな、[Unity](http://japan.unity3d.com/)には[Trail Render](http://docs.unity3d.com/ja/current/Manual/class-TrailRenderer.html)という機能があります。
簡単に言うと、オブジェクトの動きに合わせて、オブジェクトの後ろに軌跡を発生させてくれるものです。
例えば、飛行機の飛行機雲を表現したり、[斬撃の軌跡表示](http://blog.cosmocleaner.info/unity_sword_track/)などに使ったりします。

例からも分かるかもしれないのですが、通常は単色で軌跡を表現する事がほとんどです。

この軌跡を単色でなくて、色を変化させたい。というのが今回の内容です。
[Unity](http://japan.unity3d.com/)のバージョンは、5.3.0f4です。

#Trail Render
オブジェクトに、上のメニューからComponent -> Effects -> Trail Renderで追加してみます。
Trail Renderのインスペクターパネルは、5.3.0f4だとこんな感じです。

![ins1.png](https://qiita-image-store.s3.amazonaws.com/0/31946/175b63c5-3036-e5f3-4b8a-655d9652ca8b.png)

#Trail Renderを追加しただけ
このまま実行してみます。

![trails1.png](https://qiita-image-store.s3.amazonaws.com/0/31946/fe845046-3d4f-6a08-bd9f-142ccf8d8c3a.png)

軌跡は表現できているのですが、色がピンク色？紫色？です。
インスペクターパネルのColorsを考えると白になりそうですよね。

#Materialを追加してみる
通常、オブジェクトの色を変える時は、Materialを設定するらしいです。

参考
[Unity GameObjectの色変更(C#)](http://qiita.com/ryusukefuda/items/b45a88d860dcd55e057b)
[UnityでMaterialを追加して色を変更する方法【初心者向け】](http://techacademy.jp/magazine/4007)

ということで、インスペクターパネルのMaterialsのElementsにMaterialを追加してみます。

Assets -> Materials -> Create -> Materialで追加します。
プロジェクトパネルに追加されるので、色はよしなに設定するといいと思います。

![trail3.png](https://qiita-image-store.s3.amazonaws.com/0/31946/a235296c-060b-732e-d421-b4d20aa37319.png)

色が変更できました。

#Colorsを変更してみる
色の変更はできたのですが、単色のままです。
徐々にフェードしていくような設定にしているので、徐々に薄くはなっているように見えますが。

公式リファレンスによると、インスペクターパネルのColorlsで色を変化させる事ができるようです。
>・トレイル色
5つの異なる色 / 不透明度の組み合わせを通じて、トレイルを循環できます。色を使うことで、明るい緑のプラズマトレイルを徐々に薄暗くし、最終的に鈍い灰色の消失にするか、虹のその他の色を循環させることができます。色を変更したくない場合は、各色の不透明度を変更し、トレイルを先頭や末尾でフェードインおよびフェードアウトさせると、非常に効率的です。

Colorsを設定してみます。
ここの色も、よしなに。

![ins4.png](https://qiita-image-store.s3.amazonaws.com/0/31946/06be4e79-60a7-2e2f-632d-28ed1124aa6b.png)

実行！

![trail2.png](https://qiita-image-store.s3.amazonaws.com/0/31946/18a1a9d6-9408-0417-a79f-1268368450e2.png)

変わらない！

#Materialのshaderを変更する
いろいろ調べてみると、MaterialのShaderがデフォルトのStandartだとダメみたいです。

参考
[Unity and touch controls](http://pixelnest.io/tutorials/unity-touch-controls/)

先ほど作成したMaterialのShaderを変更します。
Materialを選択してインスペクターパネルの、Shader -> Sprites -> Defaultにします。

![ins2.png](https://qiita-image-store.s3.amazonaws.com/0/31946/c28cace6-0d6d-b22a-906b-e059f23e333d.png)

再度、実行します。

![ins5.png](https://qiita-image-store.s3.amazonaws.com/0/31946/41fdc640-7392-1d59-04f2-6b499d008e78.png)

できました！

#おわり
Trail Renderのインスペクターパネルで何とかできるものだと思っていて、MaterialのShaderを変更しなければいけないという事に気付かなかったので、もっと勉強します。

あと、今ほど、高校数学で数3Cまでやってた事に感謝したことはない......