💬

Unityシェーダー超入門② 色を塗ろう

2023/03/25に公開

今回は色を塗り替えてやろうと思います

とりあえず新規でUnlitShaderを作り、マテリアルを作成しましょう。
作成したマテリアルをCubeにアタッチすると、真っ白く塗りつぶされます。
今日はこの色を変えてやろうかと思います。

UnlitShader
Shader "Unlit/08_ColorChange"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
    }
    SubShader
    {
        Tags { "RenderType"="Opaque" }
        LOD 100

        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            // make fog work
            #pragma multi_compile_fog

            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                UNITY_FOG_COORDS(1)
                float4 vertex : SV_POSITION;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;

            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                UNITY_TRANSFER_FOG(o,o.vertex);
                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                fixed4 col = tex2D(_MainTex, i.uv);
                // apply fog
                UNITY_APPLY_FOG(i.fogCoord, col);
                return col;
            }
            ENDCG
        }
    }
}

デフォルトで作成しただけでこの量…正直どこを弄ればいいのか分からない…って最初はなりました。
色を変えるだけなら凄く簡単です!注目すべきはここのコーディングだけです。

UnlitShader
            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                fixed4 col = tex2D(_MainTex, i.uv);
                // apply fog
                UNITY_APPLY_FOG(i.fogCoord, col);
                return col;
            }

ここをこう変えます。

UnlitShader
            fixed4 frag (v2f i) : SV_Target
            {
                // 下記一行だけを変えました。
                fixed4 col = float4(1,0,0,1);
                // apply fog
                UNITY_APPLY_FOG(i.fogCoord, col);
                return col;
            }


赤くなりました。
解説をすると、RGBAの色味を指定しただけです!

UnlitShader
fixed4 col = float4(1,0,0,1);

「え!?RGBって0-255で指定するのでは?」

僕も初めはそう思っていました、基本的には0-1の正規化した値を入れるの風習です。
楽だからなんだと思われます。
ちなみに

UnlitShader
fixed4 col = float4(255.0/255.0,0,0,1);

この入力でも上と同じ結果を得れます。
浮動小数点は必要になりますので注意してください!
ただこの書き方は一般的じゃないと思う。
ちなみにRGBAなので、最後の4つ目はアルファ値が弄れます。

手入力は流石に面倒

もう少し手を加えましょう。Propertiesに_Colorという項目を追加しました。
変数名に_アンダースコアを付けるの忘れずに!
何故アンダースコアを付けるのか
理由はシェーダー内で定義された変数とエディター上のプロパティを区別するためのようです。
とりあえず、プロパティを宣言する時はアンダースコアを付ける!これは意識しましょう。
さて、話に戻ります
"Color"はインスペクター上に表記される名称です。
Colorは型の宣言です。
(1,1,0,1)はデフォルト値を入れています。

UnlitShader
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
        _Color("Color", Color) = (1,1,0,1)
    }

さらに中腹部辺りにあるここに「float4 _Color;」の記述を追加

UnlitShader
            sampler2D _MainTex;
            float4 _MainTex_ST;
	    //以下の記述を追加
            float4 _Color;

そして、frag関数のcolに代入する値を_Colorに変更する。

UnlitShader
		// 下記一行だけを変えました。
		//fixed4 col = float4(1,0,0,1);
		// 代入する値を_Colorに変更
                fixed4 col = _Color;

すると、マテリアルのインスペクターにColorの項目が追加され
カラーサークルで色替えが出来るように!!!!!!!

下記の記述って必要なの???って思う人がいると思います。

必 要 で す

UnlitShader
            sampler2D _MainTex;
            float4 _MainTex_ST;
	    //無くてもいいんじゃ…?って思ったことがありました。
            float4 _Color;

試しにfloat4 _Color;を消して保存するとコンパイルが通らないです。

PropertiesってそもそもUnity側がShaderに簡単に値を渡せるように用意してあるものなんです。
ただし、Pass内で使用するために宣言をしなければいけません。
恐らくスコープ外とかそういう理由なんだと思います。
最初の頃によく起こすと思います!!!!!
エラーを吐いている際はプロパティが正しく宣言されているかを確認してみましょう。
なお宣言する位置は特に決まってはいませんが、まとめておいたほうがいいでしょう。
以上が色を変えるというお話でした。

Discussion