Unity Shader 素描效果

Unity Shader系列文章:Unity Shader目錄-初級(jí)篇

Unity Shader系列文章:Unity Shader目錄-中級(jí)篇

效果:
素描風(fēng)格的渲染效果
原理:

使用6張素描紋理進(jìn)行渲染。在渲染階段,首先在頂點(diǎn)著色階段計(jì)算逐頂點(diǎn)的光照,根據(jù)光照結(jié)果來決定6張紋理的混合權(quán)重,并傳遞給片元著色器。然后,在片元著色器中根據(jù)這些權(quán)重來混合6張紋理的采樣結(jié)果。

6張素描紋理:


hatch_0.jpg
hatch_1.jpg
hatch_2.jpg
hatch_3.jpg
hatch_4.jpg
hatch_5.jpg

shader代碼:

// 素描風(fēng)格效果
Shader "Custom/Hatching"
{
    Properties
    {
        _Color ("Color Tint", Color) = (1, 1, 1, 1)
        _TileFactor ("Tile Factor", Float) = 1 // 紋理的平鋪系數(shù),越大則素描線條越密
        _Outline ("Outline", Range(0, 1)) = 0.1 // 描邊寬度
        _Hatch0 ("Hatch 0", 2D) = "white" { }// 6張素描紋理
        _Hatch1 ("Hatch 1", 2D) = "white" { }
        _Hatch2 ("Hatch 2", 2D) = "white" { }
        _Hatch3 ("Hatch 3", 2D) = "white" { }
        _Hatch4 ("Hatch 4", 2D) = "white" { }
        _Hatch5 ("Hatch 5", 2D) = "white" { }
    }

    SubShader
    {
        Tags { "RenderType" = "Opaque" "Queue" = "Geometry" }

        // 通過UsePass語義,指明調(diào)用之前寫好的Pass渲染輪廓線(Pass代碼詳見之前文章《Unity Shader 卡通渲染效果》)
        UsePass "Custom/ToonShading/OUTLINE"

        // Base Pass 計(jì)算平行光、環(huán)境光
        Pass
        {
            Tags { "LightMode" = "ForwardBase" }

            CGPROGRAM

            // 編譯指令,保證在pass中得到Pass中得到正確的光照變量
            #pragma multi_compele_fwdbase

            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"
            #include "Lighting.cginc"
            #include "AutoLight.cginc"
            #include "UnityShaderVariables.cginc"

            fixed4 _Color;
            float _TileFactor;
            sampler2D _Hatch0;
            sampler2D _Hatch1;
            sampler2D _Hatch2;
            sampler2D _Hatch3;
            sampler2D _Hatch4;
            sampler2D _Hatch5;

            // 應(yīng)用傳遞給定點(diǎn)著色器的數(shù)據(jù)
            struct a2v
            {
                float4 vertex: POSITION; // 語義: 頂點(diǎn)坐標(biāo)
                float3 normal: NORMAL; // 語義: 法線
                float4 texcoord: TEXCOORD0; // 語義: 紋理坐標(biāo)
                float4 tangent: TANGENT; // 語義: 切線
            };

            // 頂點(diǎn)著色器傳遞給片元著色器的數(shù)據(jù)
            struct v2f
            {
                float4 pos: SV_POSITION; // 語義: 裁剪空間的頂點(diǎn)坐標(biāo)
                float2 uv: TEXCOORD0;
                fixed3 hatchWeights0: TEXCOORD1; // 存儲(chǔ)6張紋理的權(quán)重
                fixed3 hatchWeights1: TEXCOORD2; // 存儲(chǔ)6張紋理的權(quán)重
                float3 worldPos: TEXCOORD3;
                SHADOW_COORDS(4) // 內(nèi)置宏:聲明一個(gè)用于對(duì)陰影紋理采樣的坐標(biāo) (這個(gè)宏參數(shù)需要是下一個(gè)可用的插值寄存器的索引值,這里是4)
            };

            // 頂點(diǎn)著色器
            v2f vert(a2v v)
            {
                v2f o;
                
                // 將頂點(diǎn)坐標(biāo)從模型空間變換到裁剪空間
                // 等價(jià)于o.pos = mul(UNITY_MATRIX_MVP, v.vertex);
                o.pos = UnityObjectToClipPos(v.vertex);
                
                o.uv = v.texcoord.xy * _TileFactor;
                
                fixed3 worldLightDir = normalize(WorldSpaceLightDir(v.vertex));
                fixed3 worldNormal = UnityObjectToWorldNormal(v.normal);
                // 計(jì)算漫反射系數(shù)
                fixed diff = max(0, dot(worldLightDir, worldNormal));
                
                o.hatchWeights0 = fixed3(0, 0, 0);
                o.hatchWeights1 = fixed3(0, 0, 0);

                //  將漫反射系數(shù)diff縮放到[O, 7] 范圍
                // 們把[O, 7] 區(qū)間均勻劃分為7個(gè)子區(qū)間 ,通過判斷 hatchFactor 所處的子區(qū)間來計(jì)算對(duì)應(yīng)的紋理混合權(quán)重。
                float hatchFactor = diff * 7;
                if (hatchFactor > 6)
                {
                    // 純白色,什么也不做
                }
                else if (hatchFactor > 5)
                {
                    o.hatchWeights0.x = hatchFactor - 5;
                }
                else if (hatchFactor > 4)
                {
                    o.hatchWeights0.x = hatchFactor - 4;
                    o.hatchWeights0.y = 1 - o.hatchWeights0.x;
                }
                else if (hatchFactor > 3)
                {
                    o.hatchWeights0.y = hatchFactor - 3;
                    o.hatchWeights0.z = 1 - o.hatchWeights0.y;
                }
                else if (hatchFactor > 2)
                {
                    o.hatchWeights0.z = hatchFactor - 2;
                    o.hatchWeights1.x = 1 - o.hatchWeights0.z;
                }
                else if (hatchFactor > 1)
                {
                    o.hatchWeights1.y = hatchFactor;
                    o.hatchWeights1.z = 1 - o.hatchWeights1.y;
                }
                else
                {
                    o.hatchWeights1.y = hatchFactor;
                    o.hatchWeights1.z = 1.0 - o.hatchWeights1.y;
                }

                o.worldPos = mul(unity_ObjectToWorld, v.vertex).xyz;

                // 內(nèi)置宏:用于計(jì)算聲明的陰影紋理坐標(biāo)
                TRANSFER_SHADOW(o);

                return o;
            }

            // 片元著色器
            fixed4 frag(v2f i): SV_TARGET
            {
                // 采樣素描紋理,并和它們對(duì)應(yīng)的權(quán)重值相乘得到每張紋理的采樣顏色
                fixed4 hatchTex0 = tex2D(_Hatch0, i.uv) * i.hatchWeights0.x;
                fixed4 hatchTex1 = tex2D(_Hatch1, i.uv) * i.hatchWeights0.y;
                fixed4 hatchTex2 = tex2D(_Hatch2, i.uv) * i.hatchWeights0.z;
                fixed4 hatchTex3 = tex2D(_Hatch3, i.uv) * i.hatchWeights1.x;
                fixed4 hatchTex4 = tex2D(_Hatch4, i.uv) * i.hatchWeights1.y;
                fixed4 hatchTex5 = tex2D(_Hatch5, i.uv) * i.hatchWeights1.z;

                // 計(jì)算純白在渲染中的貢獻(xiàn)度,通過從1中減去所有6紋理的權(quán)重來得到的。
                // 是因?yàn)樗孛柚型辛舭椎牟糠郑话阍谧詈蟮匿秩局泄庹兆盍恋牟糠质羌儼咨?                fixed4 whiteColor = fixed4(1, 1, 1, 1) * (1 - i.hatchWeights0.x - i.hatchWeights0.y - i.hatchWeights0.z -
                i.hatchWeights1.x - i.hatchWeights1.y - i.hatchWeights1.z);

                fixed4 hatchColor = hatchTex0 + hatchTex1 + hatchTex2 + hatchTex3 + hatchTex4 + hatchTex5 + whiteColor;

                // 計(jì)算陰影值和光照衰減
                UNITY_LIGHT_ATTENUATION(atten, i, i.worldPos);

                return fixed4(hatchColor.rgb * _Color.rgb * atten, 1);
            }

            ENDCG

        }
    }
    FallBack "Diffuse"
}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容