「UnityShader笔记」09. 遮罩纹理

Part1.效果图

(使用遮罩纹理前)

(使用遮罩纹理后)

可以看到,遮罩纹理可以使得高光更加细腻、更加可控

Part2.原理简介

遮罩纹理本质也是一张纹理,它反映了某像素点被高光影响的程度

通过遮罩纹理,我们可以屏蔽高光对一些不希望被高光照亮的区域的影响,还可调节高光在不同区域的表现程度,使得高光富有变化,更加细腻,真实感更强

对于遮罩纹理的采样也和其他种类纹理一样,是在片元着色器完成的,完成采样后乘在高光项的计算式后即可

Part3.代码逐段解析

Properties
    {
        _Color ("Color", Color) = (1,1,1,1)
        _MainTex ("Albedo (RGB)", 2D) = "white" {}
        _BumpMap("Normal Map", 2D) = "bump" {}
        _BumpScale("Bump Scale", Float) = -0.8
        _SpecularMask("Specular Mask", 2D) = "white"{}  //遮罩纹理
        _SpecularScale("Specular Scale", Float) = 1.0  //遮罩纹理强度因子
        _Specular("Specular", Color) = (1,1,1,1)
        _Gloss("Gloss", Range(8.0, 256)) = 200
    }

 在属性块中,我们需要额外定义遮罩纹理和遮罩纹理强度因子(用于对遮罩强度进行控制)

struct a2v{
    float4 vertex : POSITION;
    float3 normal : NORMAL;
    float4 tangent : TANGENT;
    float4 texcoord : TEXCOORD0;
};

在顶点着色器的输入结构体中,我们需要获取顶点处的切向量,用于构造从模型空间到切线空间的变换矩阵

struct v2f{
    float4 pos : SV_POSITION;
    float2 uv : TEXCOORD0;
    float3 lightDir : TEXCOORD1;
    float3 viewDir : TEXCOORD2;
};

在顶点着色器到片元着色器的通信结构体中,需要获取顶点切线空间中的光照向量和观察向量

v2f vert(a2v v){
    v2f o;
    o.pos = UnityObjectToClipPos(v.vertex);
    o.uv.xy = v.texcoord.xy * _MainTex_ST.xy + _MainTex_ST.zw;

    //调用Unity内置宏,构造从模型空间到切线空间的变换矩阵
    TANGENT_SPACE_ROTATION;

    //利用旋转矩阵,将模型空间下的光照向量和观察向量变换到切线空间
    o.lightDir = mul(rotation, ObjSpaceLightDir(v.vertex)).xyz;
    o.viewDir = mul(rotation, ObjSpaceViewDir(v.vertex)).xyz;

    return o;
}

顶点着色器部分,代码与法线贴图实现凹凸效果一致

fixed4 frag(v2f i) : SV_Target {
    fixed3 tangentLightDir = normalize(i.lightDir);
    fixed3 tangentViewDir = normalize(i.viewDir);

    //对法线贴图采样后,进行反变换
    fixed3 tangentNormal = UnpackNormal(tex2D(_BumpMap, i.uv));

    //乘以凹凸系数
    tangentNormal.xy *= _BumpScale;

    //通过单位向量特性,求出z
    tangentNormal.z = sqrt(1.0 - saturate(dot(tangentNormal.xy,tangentNormal.xy)));

    fixed3 albedo = tex2D(_MainTex, i.uv).rgb * _Color.rgb;

    fixed3 ambient = UNITY_LIGHTMODEL_AMBIENT.xyz * albedo;

    fixed3 diffuse = _LightColor0.rgb * albedo * max(0, dot(tangentNormal, tangentLightDir));

    fixed3 halfDir = normalize(tangentLightDir + tangentViewDir);

    //对遮罩纹理进行采样,并乘以遮罩强度因子
    fixed specularMask = tex2D(_SpecularMask, i.uv).r * _SpecularScale;

    //正常按Blinn-Phong模型计算高光项,最后乘以遮罩纹理的采样值即可
    fixed3 specular = _LightColor0.rgb * _Specular.rgb * pow(max(0,dot(tangentNormal, halfDir)), _Gloss) * specularMask;

    return fixed4(ambient + diffuse + specular, 1.0);
}

在片元着色器部分,我们需要额外对遮罩纹理进行采样,然后乘在高光项计算式中,用于对高光进行控制

Part4.一些问题

Q1.为什么使用了三张纹理,却只定义了主纹理的纹理属性变量_MainTex_ST?

这是因为三张纹理可以共享同一个纹理属性变量,因为他们所用的尺度变换系数和偏移系数是完全相同的,这样可以在使用多张纹理时,节省插值寄存器的空间

Q2.为什么遮罩纹理采样后,只使用了R分量?

因为这种情况下,遮罩纹理中每个纹素的三个分量都是相同的,都代表了相同的遮罩信息,所以只取一个即可。实际上,多余的两个分量还可以用来做更多的工作,存储更多种属性

Part5.完整代码

Shader "Chapter7/maskTexture"
{
    Properties
    {
        _Color ("Color", Color) = (1,1,1,1)
        _MainTex ("Albedo (RGB)", 2D) = "white" {}
        _BumpMap("Normal Map", 2D) = "bump" {}
        _BumpScale("Bump Scale", Float) = -0.8
        _SpecularMask("Specular Mask", 2D) = "white"{} 
        _SpecularScale("Specular Scale", Float) = 1.0
        _Specular("Specular", Color) = (1,1,1,1)
        _Gloss("Gloss", Range(8.0, 256)) = 200
    }
    SubShader
    {
        Pass{
            Tags{"LightMode" = "ForwardBase"}

            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "Lighting.cginc"

            fixed4 _Color;
            sampler2D _MainTex;
            float4 _MainTex_ST;
            sampler2D _BumpMap;
            float _BumpScale;
            sampler2D _SpecularMask;
            float _SpecularScale;
            fixed4 _Specular;
            float _Gloss;

            struct a2v{
                float4 vertex : POSITION;
                float3 normal : NORMAL;
                float4 tangent : TANGENT;
                float4 texcoord : TEXCOORD0;
            };

            struct v2f{
                float4 pos : SV_POSITION;
                float2 uv : TEXCOORD0;
                float3 lightDir : TEXCOORD1;
                float3 viewDir : TEXCOORD2;
            };

            v2f vert(a2v v){
                v2f o;
                o.pos = UnityObjectToClipPos(v.vertex);
                o.uv.xy = v.texcoord.xy * _MainTex_ST.xy + _MainTex_ST.zw;

                TANGENT_SPACE_ROTATION;

                o.lightDir = mul(rotation, ObjSpaceLightDir(v.vertex)).xyz;
                o.viewDir = mul(rotation, ObjSpaceViewDir(v.vertex)).xyz;

                return o;
            }

            fixed4 frag(v2f i) : SV_Target {
                fixed3 tangentLightDir = normalize(i.lightDir);
                fixed3 tangentViewDir = normalize(i.viewDir);

                fixed3 tangentNormal = UnpackNormal(tex2D(_BumpMap, i.uv));

                tangentNormal.xy *= _BumpScale;

                tangentNormal.z = sqrt(1.0 - saturate(dot(tangentNormal.xy,tangentNormal.xy)));

                fixed3 albedo = tex2D(_MainTex, i.uv).rgb * _Color.rgb;

                fixed3 ambient = UNITY_LIGHTMODEL_AMBIENT.xyz * albedo;

                fixed3 diffuse = _LightColor0.rgb * albedo * max(0, dot(tangentNormal, tangentLightDir));

                fixed3 halfDir = normalize(tangentLightDir + tangentViewDir);

                fixed specularMask = tex2D(_SpecularMask, i.uv).r * _SpecularScale;

                fixed3 specular = _LightColor0.rgb * _Specular.rgb * pow(max(0,dot(tangentNormal, halfDir)), _Gloss) * specularMask;

                return fixed4(ambient + diffuse + specular, 1.0);
            }

            ENDCG
        }
    }
    FallBack "Diffuse"
}

Part6.参考

· Unity Shader 入门精要 ——冯乐乐

posted @ 2022-06-06 22:53  睦月兔  阅读(68)  评论(0编辑  收藏  举报