ShaderGraphもShaderのコードも触ったこと無い人向けに
ShaderGraphで作った炎シェーダーを使ってShaderGraphの基礎を解説します
目次
SampleGradientによる色つけ
Multiplyによる色つけ
まずこちらが例の炎シェーダーです
(マウスポインターウロウロしてごめんなさい)
早速中身の解説に入リます
まず、このシェーダーグラフの大まかな流れですが、白黒のシェーダーを作って最後に色を塗っています。
大体のシェーダーグラフはこの方法が使われているので、本格的な白黒の部分は後に回して、まず色つけの部分を解説します
SampleGradientによる色つけ
これが色付けの部分のノードですね。Sample Gradientというノードを使っています
公式の説明ページ
https://docs.unity3d.com/Packages/com.unity.shadergraph@6.9/manual/Sample-Gradient-Node.html
をみても僕にはナンノコッチャ分かりませんでしたが、
おそらく「Gradient(G)」で受け取ったグラデーションの左端を0,右端を1とし、「Time(1)」から受け取った0～1の値でグラデーションの1部分から色を抽出して表示する
という作業をピクセルごとに行っている感じだと思います
今回のシェーダーグラフでは白黒画像の真っ黒～真っ白が0～1の値を持っているのでそれを使っています。
あとグラデーションはブラックボードからプロパティに追加できるのにインスペクターでいじることはできなさそうです
とりあえずSample Gradientにグラデーションと白黒画像繋ぐと
真っ白～真っ黒をグラデーションの左端～右端で色つけてくれるってことです。
Multiplyによる色つけ
SampleGradientだけでなく、Multiplyでも色つけができます（むしろこっちのが一般的かも） Multiplyというのは乗算、つまり掛け算ですね こちらも公式にページ貼っておきます https://docs.unity3d.com/Packages/com.unity.shadergraph@6.9/manual/Multiply-Node.html  こうノードを繋ぐとできます これは単純で白黒画像の0～1の値をオレンジの色のRGBAにそれぞれ掛けているだけです。 一応ですが白黒画像の値はR=G=B=Aです Multiplyは色つけ以外でも画像を混ぜ合わせる時とかによく出てくるんで覚えていてくださいとりあえず色つけに関してはこんなもんで。次回から本格的なシェーダーグラフ作りって感じです。