INDEX

シェーダー基礎、Imageにシェーダーを反映させる方法

関連ページ 参考URL このページでは細かいシェーダーの内容には触れずに、超初心者向けにImage/マテリアル/シェーダーの簡潔な関係性だけ見ていく。
次ページ から本格的にシェーダーの作り方を解説。 一度シェーダーを使い始めると、もはやシェーダーを使わないゲーム開発など有り得ないとさえ思えてくる。
シェーダーは3Dゲームでしか使わないと思ってる人も多いが、そんな事はなくて、2Dでもバリバリに使う。
下の動画は 発光シェーダー と モザイクシェーダー を使った効果の一例。

今回の場合自作したシェーダーは使わないが、全体を把握するために一度新規シェーダーの作り方を確認してみる。
Project上で右クリックし、Create > Shaderから、いくつかのシェーダーを作成できる。
しかしここから作成できる5種類のシェーダーは、全てuGUIに対応しておらずImageコンポーネントには使えない。
uGUI用のシェーダーとしては、UI-Defaultという標準シェーダーが用意されている。
ImageコンポーネントのMaterialの欄がNoneの場合に、内部で選択されているシェーダーがこれ。
下のgitのリポジトリから、UI-Defaultのコードを確認できる。
コードの一つ一つの意味は初心者が最初に触れるのはキツいのでここでは深く解説しない。
しかしマテリアルとの繋がりを理解するために、最初の数行だけ見てみる。 このUI/Defaultというのが、後にマテリアルから指定するパスになる。
例えばUI-Defaultをちょっとカスタマイズしたい場合は、上のソースをコピペ改変し、パスをUI/Defaultから変えてあげればOK。
ファイル名は拡張子が.shaderであれば何でも良い。 Imageコンポーネントに直接シェーダーをアタッチすることは出来ない。
そこでマテリアルを作る必要がある。
Project上を右クリックし、Create > Materialからマテリアルを生成。
作成したNew Materialをクリックし、Inspector上部からシェーダーのパスを選択する。
とりあえずUI > Defaultを選択する。
最後にImageコンポーネントのMaterialの欄に、作成したマテリアルをアタッチすればOK。
ただ今回の場合はマテリアルがUI-Defaultを選択してるので、全く挙動は変わらない。