Unity Shader：Waveform波形(2)

您所在的位置：网站首页 › sin函数表示电磁波频率 › Unity Shader：Waveform波形(2)

Unity Shader：Waveform波形(2)

2024-07-11 13:47| 来源: 网络整理| 查看: 265

概述

在Shader中，波形可以作为一种模拟动态的手段，例如颜色的波动，形状的波动，可以基于此创作出各种效果。下文介绍几种基本波形以及变种的Shader实现代码，并配以函数图像和简单动画效果图。在效果图中，Shader代码计算出y值，在顶点着色器中赋给顶点的y坐标或在片段着色器中插值后乘以颜色。效果图中利用了一个细长条网格，它的uv.x的两端为0和一个与它长度等比例的一个较大的值。

波形公式中参数的说明：

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.0f3.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

顶点波动动画：

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)); //Saturate Exponential SawTooth //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)); //Saturate Exponential SawTooth //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)); 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 } } }

参考： Algorithmic drawing,Patricio Gonzalez Vivo https://thebookofshaders.com/05/ Quake3 Arena Shader Manual Revision#12, Paul Jaquays and Brian Hook Tilt Brush, Google 维护日志： 2020-8-15：review

【本文地址】

公司简介

联系我们