码迷,mamicode.com
首页 > 编程语言 > 详细

Unity Shader 效果学习

时间:2016-04-05 17:54:18      阅读:314      评论:0      收藏:0      [点我收藏+]

标签:

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)附上原图

技术分享

暂时就这么多吧,还有其他特效,以后慢慢更新

Unity Shader 效果学习

标签:

原文地址:http://blog.csdn.net/xiaomuzi0802/article/details/51064845

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!