2021年4月

最新推荐文章于 2021-07-05 16:35:18 发布

原创最新推荐文章于 2021-07-05 16:35:18 发布 · 74 阅读

0 ·

CC 4.0 BY-SA版权

本文详细介绍了一个名为AvatarMask的Shader，该Shader通过定义多种属性来实现特定的视觉效果，包括纹理映射、羽化范围和强度调整等。文章还介绍了如何通过代码片段控制这些属性，并展示了如何在Unity中实现透明效果和光照模式。

开发新功能

帮助团队新成员熟悉项目

ignore 无效

清空缓存　　git rm -rf --cached .

重新添加　　git add .

Shader "Custom/AvatarMask" {
    Properties {
        // 纹理
        [PerRendererData]_MainTex ("MainTex", 2D) = "white" {}
        _Offset ("Offset", Vector) = (0.5,0.5,0,0)
        // 羽化范围 从中心点 向外扩散
        _FeatherRange ("Feather Range", Range(0, 1)) = 0.3418804
        // 羽化强度
        _FeatherIntensity ("Feather Intensity", Range(0, 200)) = 1
        [MaterialToggle] _EnableMaskClip ("Enable MaskClip", Float ) = 0.3418804
        _ClipRange ("Clip Range", Range(0, 1)) = 0.3773913
        [MaterialToggle] _EnableMultiple ("Enable Multiple", Float ) = -1
        // 是否开启遮罩
        [MaterialToggle] _EnableCustomMask ("Enable Custom Mask", Float ) = 0
        [NoScaleOffset]_Mask ("Mask", 2D) = "white" {}
        // 
        _ScaleandOffset ("Scale and Offset", Vector) = (1,1,1,1)
        [HideInInspector]_Cutoff ("Alpha cutoff", Range(0,1)) = 0.5
    }
    SubShader {
        Tags {
            "IgnoreProjector"="True"
            "Queue"="Transparent"
            "RenderType"="Transparent"
        }
        Pass {
            Name "FORWARD"
            Tags {
                "LightMode"="ForwardBase"
            }
            Blend SrcAlpha OneMinusSrcAlpha
            ZWrite Off
            
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            // #define UNITY_PASS_FORWARDBASE    // redefinition
            #include "UnityCG.cginc"
            #pragma multi_compile_fwdbase
            #pragma only_renderers d3d9 d3d11 glcore gles gles3 metal 
            #pragma target 3.0
            uniform sampler2D _MainTex; uniform float4 _MainTex_ST;
            uniform float _FeatherIntensity;
            uniform float _ClipRange;
            uniform fixed _EnableMaskClip;
            uniform float4 _Offset;
            uniform float _FeatherRange;
            uniform fixed _EnableCustomMask;
            uniform sampler2D _Mask;
            uniform float4 _Mask_ST;
            uniform fixed _EnableMultiple;
            uniform float4 _ScaleandOffset;

            // vert函数 接收的 输入的顶点数据
            struct VertexInput {
                float4 vertex : POSITION;    // local 坐标    x, y, z, w
                // 纹理坐标和 图片相关， 不一定是 0 - 1
                // x uv0 range [0.425, 0567] 从左往右
                // y uv0 range [0.724, 0.852] 从下往上
                float2 texcoord0 : TEXCOORD0;    
                float4 vertexColor : COLOR;    // 顶点颜色 r, g, b, a
            };

            // frag函数 接收的 顶点数据 转换后的 数据
            struct VertexOutput {
                float4 pos : SV_POSITION;    // 坐标
                float2 uv0 : TEXCOORD0;    // UV 纹理坐标和 图片相关
                float4 vertexColor : COLOR;    // 顶点经过插值后的颜色
            };

            VertexOutput vert (VertexInput v) {
                VertexOutput o = (VertexOutput)0;
                // 插值 纹理坐标
                o.uv0 = v.texcoord0;
                // 插值 颜色
                o.vertexColor = v.vertexColor;
                // 
                o.pos = UnityObjectToClipPos( v.vertex );
                return o;
            }

            float4 frag(VertexOutput i) : COLOR {
                // #define TRANSFORM_TEX(tex,name) (tex.xy * name##_ST.xy + name##_ST.zw)
                // tex2D(sampler2D tex, float2 s)
                // 采样 Image 上的图片
                float4 _MainTex_var = tex2D(_MainTex,TRANSFORM_TEX(i.uv0, _MainTex));
                // Image 上的图片 乘  颜色
                float3 emissive = (_MainTex_var.rgb * i.vertexColor.rgb);
                float3 finalColor = emissive;

                // _EnableMultiple = 1
                // 使用 float2(((i.uv0.r-_ScaleandOffset.b)/_ScaleandOffset.r),((i.uv0.g-_ScaleandOffset.a)/_ScaleandOffset.g)) 
                // _EnableMultiple = 0,
                // 使用 i.uv0
                float2 _EnableMultiple_var = lerp(
                    i.uv0, 
                    // (原图x - x轴偏移) / x轴比例, e.g. (1 - 0.5 / 2)
                    // (原图y - y轴偏移) / y轴比例
                    float2(
                        ((i.uv0.r - _ScaleandOffset.b) / _ScaleandOffset.r),
                        ((i.uv0.g - _ScaleandOffset.a) / _ScaleandOffset.g)
                        ),
                    _EnableMultiple);

                
                float node_1483 = pow(
                                    // clamp(x, min, max)
                                    clamp(
                                        (
                                            (1.0 - 
                                                // 限制结果 [0 - 1]
                                                saturate(
                                                    // 获取 两点 之间的距离
                                                    distance(_EnableMultiple_var, float2(_Offset.r, _Offset.g))
                                                )
                                             ) 
                                          + _FeatherRange
                                        )
                                        ,0,1),
                                    _FeatherIntensity);

                // 采样 遮罩
                float4 _Mask_var = tex2D(_Mask,_EnableMultiple_var);

                // return float4(1, 1, 1, 1);    // 为每个 fragment 输出颜色
                // return float4(i.uv0.x, 0, 0, 1);    // x轴 插值
                // return float4(i.uv0.y, 0, 0, 1);    // y轴 插值, 方向向下
                // return float4(i.vertexColor.rgb, 1);
                // return tex2D(_MainTex, float2(0.4, 0.3));    // 采样原图某个点
                // return tex2D(_MainTex,TRANSFORM_TEX(i.uv0, _MainTex));    // 采样原图
                // return tex2D(_Mask, TRANSFORM_TEX(i.uv0, _Mask));
                // return tex2D(_Mask, i.uv0);
                // return float4(i.uv0.r, 0, 0, 1);

                // e.g. _Offset 在中心点, 整个区域 形成一个到 中心点的 圆
                // return float4(distance(_EnableMultiple_var, float2(_Offset.r, _Offset.g)), 0, 0, 1);
                // range 决定圆的大小, intensity 决定 圆周围的模糊外圈大小
                //return float4(pow(clamp((1.0 -saturate(distance(_EnableMultiple_var, float2(_Offset.r, _Offset.g))) + _FeatherRange), 0, 1), _FeatherIntensity), 0, 0, 1);


                return fixed4(finalColor,
                    (_MainTex_var.a * i.vertexColor.a * 
                        lerp(
                            lerp(node_1483, (1.0 - step(node_1483,_ClipRange)), _EnableMaskClip )
                            , _Mask_var.r, 
                            _EnableCustomMask
                            )
                    )
                );
            }
            ENDCG
        }
    }
    FallBack "Diffuse"
}

AvatarMask

https://blog.youkuaiyun.com/jeff_yaojie/article/details/103507959

https://hooray.github.io/posts/cbb1760/