Unity ShaderLab特效教程 适用于贴图、sprite和ugui的2d着色器实例 代码+详解注释 【可调节尺寸、间距、颜色的格子效果】

如果代码中有什么不清楚请查看以下基础知识

Shader基础知识

unity3d 中 七种坐标知识详解

可灵活调节尺寸的格子效果

使用比较余数范围值的方法，限定像素显示状态

笑狗图

代码

// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)'

Shader "Custom/Curve"
{
	Properties
	{
        _MainTex ("Main Textrue", 2D) = "white" {}
		_BackgroundColor ("Background Color", Color) = (1, 1, 1, 1)
		_CellColor ("Cell Color", Color) = (0, 0, 0, 1)
        _CellWidth ("Cell Width", Range(0, 1)) = 0.2
        _CellHeight ("Cell Height", Range(0, 1)) = 0.2
		_SpaceWidth ("Space Width", Range(0, 1)) = 0.1
        _SpaceHeight ("Space Height", Range(0, 1)) = 0.1
		_Offset_X ("X Offset", Range(-1, 1)) = 0.2
		_Offset_Y ("Y Offset", Range(-1, 1)) = 0.2
	}
	SubShader
	{
		Pass
		{
			CGPROGRAM
			#pragma vertex vert
			#pragma fragment frag
			#include "UnityCG.cginc"
            //从程序传染顶点渲染器的数据
			struct a2v
			{
				float4 vertex : POSITION;
				float2 uv : TEXCOORD0;
			};
            //从顶点渲染器传入片元渲染器的数据
			struct v2f
			{			
				float4 position : SV_POSITION;
				float2 uv : TEXCOORD0;
			};
 
			//格子背景
            sampler2D _MainTex;
			fixed4 _BackgroundColor;
			fixed4 _CellColor;
			fixed _CellWidth;
            fixed _CellHeight;
            fixed _SpaceWidth;
            fixed _SpaceHeight;
			fixed _Offset_X;
			fixed _Offset_Y;
            //顶点着色器
			v2f vert (a2v v)
			{
				v2f o;
                //将像素空间从模型转为裁剪空间
				o.position = UnityObjectToClipPos(v.vertex);
				o.uv = v.uv;
				return o;
			}
			//片段着色器
			fixed4 frag (v2f o) : COLOR
			{
                //计算完偏移的uv  //fmod:x/y的余数，*正负与x相同*	
                fixed x = fmod(o.uv.x + _Offset_X, _CellWidth);
				fixed y = fmod(o.uv.y + _Offset_Y, _CellHeight);
				//如果 x 在0-_SpaceWidth的区间就返回1  //step(a, x)：如果a > x，返回0；如果a <= x，返回1
				x = step(_SpaceWidth * 1, x);
				y = step(_SpaceHeight * 1, y);
                //获取当前uv坐标的像素颜色值
                fixed4 col = tex2D(_MainTex, o.uv);
                //最终颜色 = 背景色（x与y决定是否可见，0为不可见）+ 格子颜色 * 当前像素颜色（这里格子会与uv像素融合，如果要覆盖贴图，就去掉前面的大括号）
                col = (_CellColor * x * y + _BackgroundColor * (1 - x * y)) * col;
				return col;
			}
			ENDCG
		}
	}
}