Unity Shader:Waveform波形-基本波形:正弦、三角、锯齿、直角以及其变种的实现

发表于2018-10-29
评论0 922浏览

想免费获取内部独家PPT资料库?观看行业大牛直播?点击加入腾讯游戏学院游戏程序行业精英群

711501594
在Shader中,波形可以作为一种模拟动态的手段,例如颜色的波动,形状的波动,可以基于此创作出各种效果。

下文中就给大家介绍正弦、三角、锯齿、直角这几种基本波形以及变种的Shader实现代码,并配以函数图像和简单动画效果图。在效果图中,Shader代码计算出y值,在顶点着色器中赋给顶点的y坐标,或在片段着色器中插值后乘以颜色。

波形公式中参数的说明:

base:基点。波形的起始点。振幅从此点开始计算。
amplitude:振幅。振幅越大,波形峰值越大或谷值越小。
phase:相位。决定波形的起始值。波形随着phase整体平移。
freq:频率。单位时间内波形重复的次数。

正弦家族 Sin Family:

完美正弦 Perfect Sin:
公式描述:y=sin(x*freq+phase)*amplitude+base
Shader代码:y=sin(fmod(v.uv.x,1.0f)*2.0f*3.1415926f+_Time.y);



山形 Hill:

公式描述:y=abs(sin(x*freq+phase))*amplitude+base
Shader代码:y=abs(sin(fmod(v.uv.x,1.0f)*3.1415926f+_Time.y));


倒转山行 Inverse Hill:

公式描述:y=(1-abs(sin(x*freq+phase)))*amplitude+base
Shader代码:y=1.0f-abs(sin(fmod(v.uv.x,1.0f)*3.1415926f+_Time.y));


锯齿家族 Sawtooth Family:

锯齿 SawTooth:
公式描述:y=max(min(((x+phase) mod freq),1),0)*amplitude+base
Shader代码:y=saturate(fmod(v.uv.x+_Time.y,1.0f));


倒转锯齿 Inverse SawTooth:

公式描述:y=(max(min(((x+phase) mod freq),1),0))*amplitude+base
Shader代码:y=1-saturate(fmod(v.uv.x+_Time.y,1.0f));


指数锯齿 Exponential SawTooth:

公式描述:y=max(min(((x+phase) mod freq)^exp,1),0)*amplitude+base
Shader代码:y=saturate(pow(frac(v.uv.x+_Time.y),10.0f));


倒转指数锯齿 Inverse Exponential SawTooth:

公式描述:y=(1-max(min(((x+phase) mod freq)^exp,1),0))*amplitude+base
Shader代码:y=1-saturate(pow(fmod(v.uv.x+_Time.y,1.0f),10.0f));


饱和指数锯齿 Saturate Exponential SawTooth:

公式描述:y=min(max(min(((x+phase) mod freq)^10,1),0)*100,1)*amplitude+base
类似于指数锯齿,但单位时间内波形达到峰值时间更长
Shader代码:y=saturate(saturate(pow(fmod(x+_Time.y,1.0f),10.0f))*100.0f);


三角形家族

三角形 Triangle

公式描述:y=abs(((x*freq+phase) mod 1)*2-1)*amplitude+base
Shader代码:y=abs(fmod(x+_Time.y,1.0f)*2.0f-1.0f);


梯形 Trapezium

公式描述:y=min(abs(((x*freq+phase)mod1)*2-1)*2,1)*amplitude+base
Shader代码:y=saturate(abs(fmod(x+_Time.y,1.0f)*2.0f-1.0f)*2.0f);


倒转梯形/不连续三角形 Inverse Trapezium/Discrete Triangles

公式描述:y=(1-min(abs(((x*freq+phase)mod 1)*2-1)*2,1))*amplitude+base
Shader代码:y=1-saturate(abs(fmod(x+_Time.y,1.0f)*2.0f-1.0f)*2.0f);


直角家族

直角

公式描述:y=round(sin(x*freq+phase))*amplitude+base
Shader代码:y=round(sin(x+_Time.y));


效果图Shader

效果图中模型的顶点的uv,x值以0.1向同一方向递增。
Shader "Unlit/WaveformTest"
{
    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;
                float phase=_Time.y;
                float y;
                float x=v.uv.x;
                //perfect sin
    //          y=sin(fmod(v.uv.x,1.0f)*2.0f*3.1415926f+phase);
                //hill
    //          y=abs(sin(fmod(v.uv.x,1.0f)*3.1415926f+phase));
                //inverse hill
    //          y=1.0f-abs(sin(fmod(v.uv.x,1.0f)*3.1415926f+phase));
                //SawTooth
    //          y=saturate(fmod(v.uv.x+phase,1.0f));
                //Inverse SawTooth
    //          y=1-saturate(fmod(v.uv.x+phase,1.0f));
                //Exponential SawTooth
    //          y=saturate(pow(frac(v.uv.x+phase),10.0f));
                //Inverse Exponential SawTooth
    //          y=1-saturate(pow(fmod(v.uv.x+phase,1.0f),10.0f));
                //Chang
    //          y=saturate(saturate(pow(fmod(x+phase,1.0f),10.0f))*100.0f);
                //Triangle
    //          y=abs(fmod(x+phase,1.0f)*2.0f-1.0f);
                //Tapezoid
    //          y=saturate(abs(fmod(x+phase,1.0f)*2.0f-1.0f)*2.0f);
                //Discontinuous Triangles/Inverse Trapezoid
    //          y=1-saturate(abs(fmod(x+phase,1.0f)*2.0f-1.0f)*2.0f);
                //Square
                y=round(sin(x+phase));
                v.vertex.y=y;
                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
        }
    }
}

Shader "Unlit/WaveformTestFrag"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
        _Color("Color",color)=(1,1,1,1)
    }
    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;
                float y:FLOAT;
                UNITY_FOG_COORDS(1)
                float4 vertex : SV_POSITION;
            };
            sampler2D _MainTex;
            float4 _MainTex_ST;
            fixed4 _Color;
            v2f vert (appdata v)
            {
                v2f o;
                float phase=_Time.y;
                float y;
                float x=v.uv.x;
                //perfect sin
    //          y=sin(fmod(v.uv.x,1.0f)*2.0f*3.1415926f+phase);
                //hill
    //          y=abs(sin(fmod(v.uv.x,1.0f)*3.1415926f+phase));
                //inverse hill
    //          y=1.0f-abs(sin(fmod(v.uv.x,1.0f)*3.1415926f+phase));
                //SawTooth
    //          y=saturate(fmod(v.uv.x+phase,1.0f));
                //Inverse SawTooth
    //          y=1-saturate(fmod(v.uv.x+phase,1.0f));
                //Exponential SawTooth
    //          y=saturate(pow(frac(v.uv.x+phase),10.0f));
                //Inverse Exponential SawTooth
    //          y=1-saturate(pow(fmod(v.uv.x+phase,1.0f),10.0f));
                //Chang
    //          y=saturate(saturate(pow(fmod(x+phase,1.0f),10.0f))*100.0f);
                //Triangle
    //          y=abs(fmod(x+phase,1.0f)*2.0f-1.0f);
                //Tapezoid
    //          y=saturate(abs(fmod(x+phase,1.0f)*2.0f-1.0f)*2.0f);
                //Discontinuous Triangles/Inverse Trapezoid
    //          y=1-saturate(abs(fmod(x+phase,1.0f)*2.0f-1.0f)*2.0f);
                //Square
                y=round(sin(x+phase));
    //          v.vertex.y=y;
                o.y=y;
                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 _Color*i.y;
            }
            ENDCG
        }
    }
}
来自:https://blog.csdn.net/liu_if_else/article/details/77712935

原文链接

著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引

游戏学院公众号二维码
腾讯游戏学院
微信公众号

提供更专业的游戏知识学习平台