Unity3d shader for streamer effect

Time:2020-10-31

In this paper, we share the specific code of unity3d shader to achieve streamer effect for your reference. The specific content is as follows

Streamer effect picture:

Demo project: download address

//Functional requirements: simulate the data transmission effect, and move the highlight color block from the top to the bottom of the model
//Function analysis: here using UV animation to achieve, using alpha map to control the shape of the flow
//Use the alpha mask map to control which parts of the model need to flow

Shader "Custom/DataFlowEffect"
{
 Properties
 {
 _MainColor("Main Color",Color) = (1,1,1,1)
 _MainTex("Main Texture",2D) = "white"{}
 _Specular("Specular",Color) = (1,1,1,1)
 _Gloss("Gloss",Range(0,255)) = 20.0
 _FlowTex("Flow Tex (A)",2D) = "black"{}
 _FlowColor("Flow Color (RGBA)",Color)=(1,1,1,1)
 _FlowIdleTime("FlowInternal",Range(0,10))=1.0
 _FlowDuring("FlowDuring",Range(0,10))=1.0
 _FlowMaskTex("FlowMasking (A)",2D)="white"{}
 _FlowDirection("FlowDirection",Int)= 0
 _FlowBeginTime("Flow Begin Time",Float)=0
 }

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

 Pass
 {
  Tags{"LightMode"="ForwardBase"}
  Blend SrcAlpha OneMinusSrcAlpha

  CGPROGRAM

  #pragma vertex vert
  #pragma fragment frag

  #include "UnityCG.cginc"
  #include "Lighting.cginc"

  sampler2D _ Maintex; // color map
  half4 _ MainTex_ St; // color UV scaling and offset
  fixed3 _ Maincolor; // diffuse color
  fixed3 _ Specular; // highlight color
  fixed _ Gloss; // high luminosity
  sampler2D _ Flowtex; // data stream image
  fixed4 _ Flowcolor; // data stream color overlay
  half4 _ FlowTex_ St; // scaling and offset of data stream map UV
  fixed _ Flowidletime; // flow animation interval time
  fixed _ Flowduring; // flow animation playback time
  sampler2D _ Flowmasktex; // flow mask
  fixed _ Flowdirection; // flow direction
  float _ Flowbegintime; // the time when the flow effect starts

  struct a2v
  {
  half4 pos: POSITION;
  half3 normal :NORMAL;
  half4 texcoord : TEXCOORD0;
  };

  struct v2f
  {
  half4 position : SV_POSITION;
  half2 uv : TEXCOORD0;
  half3 worldNormal : TEXCOORD1;
  half3 worldPos : TEXCOORD2;
  half2 flowUV : TEXCOORD3;
  };

  v2f vert(a2v i)
  {
  v2f v;
  v.position = UnityObjectToClipPos(i.pos);
  v.uv = i.texcoord * _MainTex_ST.xy + _MainTex_ST.zw;
  v.worldNormal = mul(unity_ObjectToWorld,i.normal);
  v.worldPos = mul(unity_ObjectToWorld,i.pos);
  v.flowUV = i.texcoord * _FlowTex_ST.xy + _FlowTex_ST.zw;
  return v;
  }

  //UV coordinates of UV - vert
  //Scale - map scaling
  //Idletime - how long after the start of each cycle, the flow begins
  //Looptime - single flow time
  fixed4 getFlowColor(half2 uv,int scale,fixed idleTime,fixed loopTime)
  {
  //Current run time
  half flowTime_ = _Time.y - _FlowBeginTime;

  //Time interval from the beginning of the last cycle to the beginning of this cycle
  half internal = idleTime + loopTime;

  //Current cycle execution time
  half curLoopTime = fmod(flowTime_,internal);

  //Before each flow starts, there is a stop interval to check whether the flow is available
  if(curLoopTime > idleTime)
  {
   //Flow time
   half actionTime = curLoopTime - idleTime;

   //Flow progress percentage
   half actionPercentage = actionTime / loopTime;

   half length = 1.0 / scale;

   //Flow from bottom to top
   //Calculation method: let y = ax + B, where y is the lower boundary value and X is the flow progress
   //According to our requirements, y = - length when x = 0; y = 1 when x = 1
   half bottomBorder = actionPercentage * (1+length) - length;
   half topBorder = bottomBorder + length;

   //Flow from top to bottom
   //The solution is similar to the above
   if(_FlowDirection < 0)
   {
   topBorder = (-1-length) * actionPercentage + 1 + length;
   bottomBorder = topBorder - length;
   }

   if(uv.y < topBorder && uv.y > bottomBorder)
   {
   half y = (uv.y - bottomBorder) / length;
   return tex2D(_FlowTex,fixed2(uv.x,y)); 
   }
  }

  return fixed4(1,1,1,0);
  }

  fixed4 frag(v2f v):SV_Target
  {
  //Calculation of diffuse reflection coefficient
  fixed3 albedo = tex2D(_MainTex,v.uv) * _MainColor;

  //Calculating ambient light
  fixed3 ambient = UNITY_LIGHTMODEL_AMBIENT.xyz * albedo;


  Fixed3 worldnormal = normalize (v.worldnormal); // normal direction of world coordinates
  Fixed3 worldlightdir = normalize (unityworldspace lightdir (v.worldpos)); // illumination direction of world coordinates
  Fixed3 worldviewdir = normalize (unityworldspace viewdir (v.worldpos)); // view direction of world coordinates

  //The diffuse color was calculated by half Lambert model
  fixed3 lightColor = _LightColor0.rgb;
  fixed3 diffuse = lightColor * albedo * max(0,0.5*dot(worldNormal,worldLightDir)+0.5);

  //The Blinn phone highlight model was used to calculate the highlight
  fixed3 halfDir = normalize(worldViewDir + worldLightDir);
  fixed3 specColor = _Specular * lightColor * pow(max(0,dot(worldNormal,halfDir)),_Gloss);

  //Overlay flow map  
  fixed4 flowColor = getFlowColor(v.uv,_FlowTex_ST.y,_FlowIdleTime,_FlowDuring); 
  fixed4 flowMaskColor = tex2D(_FlowMaskTex,v.uv);

  //Blend with the mask map to display only the opaque part of the mask map
  flowColor.a = flowMaskColor.a * flowColor.a * _FlowColor.a;

  fixed3 finalDiffuse = lerp(diffuse,_FlowColor,flowColor.a);

  return fixed4(ambient + finalDiffuse+specColor,1);
  }

  ENDCG
 }
 }
 Fallback "Diffuse"
}

The above is the whole content of this article, I hope to help you in your study, and I hope you can support developeppaer more.

Recommended Today

Summary of computer foundation for 2021 autumn recruitment interview database, redis

Series of articles: Summary of computer foundation in autumn 2021 interview algorithm, data structure, design pattern, Linux Summary of computer foundation in autumn 2021 interview – Java foundation, JVM, spring framework Summary of computer foundation for 2021 autumn recruitment interview database, redis Summary of computer foundation for 2021 autumn recruitment interview – operating system Summary […]