Unity Shader 效果学习

Posted 2020-09-30 brucemengbm

Unity上对于图像的处理，假设单纯使用代码。那么非常遗憾，程序基本会跑死，毕竟是直接对像素的操作，读取写入都是比較耗费CPU和内存的。

所以。这次由于项目须要想实现类似哈哈镜的效果。想来想去，还是认为用unity的Shader比較好，毕竟不须要CPU做什么，仅仅用GPU就能够了。

话说GPU也是非常强大的。

以下简单说一下Shader（事实上我也是新手，学习的话，參考http://blog.csdn.net/poem_qianmo/article/details/40723789

）这是位大牛，我的一些基础知识是在里面学习的。

这次我是来分享几个Shader的，对于详细的内容原理什么的，我就不讲了。也讲不来，仅仅能大致说一下。我也在学习。

1、哈哈镜效果（放大）

Shader "Custom/MaxFace" {
	Properties {
		_MainTex("texture",2D)="white"{}
		_Radius("radius",float)=0.2
		_CenterX("centerX",float)=0.5
		_CenterY("centerY",float)=0.5
	}
	SubShader {
	tags{"Queue"="Transparent" "RenderType"="Transparent"}
	Pass{
	CGPROGRAM
	#pragma vertex vert
	#pragma fragment frag
	#include "UnityCG.cginc"
	float4 _Color;
	sampler2D _MainTex;
	float _CenterX;
	float _CenterY;
	struct v2f{
		float4 pos : SV_POSITION;
		float2 uv : TEXCOORD0;
	};
	float4 _MainTex_ST;
	v2f vert(appdata_base v){
	v2f o;
	o.pos=mul(UNITY_MATRIX_MVP,v.vertex);
	o.uv=TRANSFORM_TEX(v.texcoord,_MainTex);
	return o;
	} ;
	float newX=0;
	float newY=0;

	float _Radius;
	half4 frag(v2f i):COLOR
	{
	float tx=i.uv.x-_CenterX;
	float ty=i.uv.y-_CenterY;
	float distan=tx*tx+ty*ty;
	float real_radius=_Radius/2;
	if(distan<_Radius*_Radius){
	newX=tx/2;
	newY=ty/2;
	newX=newX*(sqrt(distan)/real_radius);
	newY=newY*(sqrt(distan)/real_radius);
	newX=newX+_CenterX;
	newY=newY+_CenterY;	
	
	}else{
	newX=i.uv.x;
	newY=i.uv.y;
	}
	
	float u_x=newX;
	float u_y=newY;
	float2 uv_earth=float2(u_x,u_y);
	half4 texcolor_earth=tex2D(_MainTex,uv_earth);

	//
	return texcolor_earth;
	}
	ENDCG
	}
	}
	FallBack "Diffuse"
}

以下是解释，将就着看一下

编译无误的话。我们看一下在Unity中的效果

新建一个Plane，导入一张图片。然后拖到Plane上面，在选择我们刚才创建的Shader

能够看到，以下的三个參数就是我们创建的在Propertes里面。随便挑以下參数。以下是效果

好吧，糟蹋了美女。。

。

算法是我从Java里面改过来的，细节就不要问我了。我是代码搬运工。。

2、哈哈镜缩小模式

我直接上代码咯，由于基本没有变什么

Shader "Custom/MinFace" {
	Properties {
		_MainTex("texture",2D)="white"{}
		_CenterX("centerX",float)=0.5
		_CenterY("centerY",float)=0.5
	}
	SubShader {
	tags{"Queue"="Transparent" "RenderType"="Transparent"}
	Pass{
	CGPROGRAM
	#pragma vertex vert
	#pragma fragment frag
	#include "UnityCG.cginc"
	float4 _Color;
	sampler2D _MainTex;
	float _CenterX;
	float _CenterY;
	struct v2f{
		float4 pos : SV_POSITION;
		float2 uv : TEXCOORD0;
	};
	float4 _MainTex_ST;
	v2f vert(appdata_base v){
	v2f o;
	o.pos=mul(UNITY_MATRIX_MVP,v.vertex);
	o.uv=TRANSFORM_TEX(v.texcoord,_MainTex);
	return o;
	} ;
	float newX=0;
	float newY=0;
	float _Radius;
	float theta=0;
	half4 frag(v2f i):COLOR
	{
	float tx=i.uv.x-_CenterX;
	float ty=i.uv.y-_CenterY;
	
	 theta = atan2(ty, tx);  
	float radius=sqrt(tx * tx+ ty * ty);  
	 float newR=sqrt(radius)*0.5 ;

	newX=_CenterX+newR*cos(theta);
	newY=_CenterY+newR*sin(theta);
	if (newX<0) 
      {  
         newX=0;
      }  
      if (newX>1)  
      {  
         newX=1;
      }
       if (newY>1)  
      {  
         newY=1;
      }
       if (newY<0)  
      {  
         newX=0;
      }
     
	float2 uv_earth=float2(newX,newY);
	half4 texcolor_earth=tex2D(_MainTex,uv_earth);

	return texcolor_earth;
	}
	ENDCG
	}
	}
	FallBack "Diffuse"
}

看看效果（事实上第二个还蛮可爱的）

3、再来个对称的

Shader "Custom/SymmertyFace" {
//对称特效
	Properties {
		_MainTex("texture",2D)="white"{}
	}
	SubShader {
	tags{"Queue"="Transparent" "RenderType"="Transparent"}
	Pass{
	CGPROGRAM
	#pragma vertex vert
	#pragma fragment frag
	#include "UnityCG.cginc"
	float4 _Color;
	sampler2D _MainTex;
	float _CenterX;
	float _CenterY;
	struct v2f{
		float4 pos : SV_POSITION;
		float2 uv : TEXCOORD0;
	};
	float4 _MainTex_ST;
	v2f vert(appdata_base v){
	v2f o;
	o.pos=mul(UNITY_MATRIX_MVP,v.vertex);
	o.uv=TRANSFORM_TEX(v.texcoord,_MainTex);
	return o;
	} ;
	half4 frag(v2f i):COLOR
	{
	float uv_x;
	if(i.uv.x>0.5){
	uv_x=1-i.uv.x;
	}else{
	uv_x=i.uv.x;
	}
     
	float2 uv_earth=float2(uv_x,i.uv.y);
	half4 texcolor_earth=tex2D(_MainTex,uv_earth);

	return texcolor_earth;
	}
	ENDCG
	}
	}
	FallBack "Diffuse"
}

看效果

额，这妹子即使对称了。看着还是挺好看（花痴ing）附上原图

临时就这么多吧，还有其它特效，以后慢慢更新