UnityShader学习——渲染纹理

渲染纹理简介

在之前的学习中,一个摄像机的渲染结果会输出到颜色缓冲中,并显示到我们的屏幕上。现代的GPU允许我们把整个三维场景渲染到一个中间缓冲中,即渲染目标纹理(Render TargetTexture, RTT),而不是传统的帧缓冲或后备缓冲(back buffer)。与之相关的是多重渲染目标(Multiple Render Target, MRT),这种技术指的是GPU允许我们把场景同时渲染到多个渲染目标纹理中,而不再需要为每个渲染目标纹理单独渲染完整的场景。延迟渲染就是使用多重渲染目标的一个应用。

Unity为渲染目标纹理定义了一种专门的纹理类型——渲染纹理(Render Texture)。

在Unity中使用渲染纹理通常有两种方式:

  1. 在Project目录下创建一个渲染纹理,然后把某个摄像机的渲染目标设置成该渲染纹理,这样一来该摄像机的渲染结果就会实时更新到渲染纹理中,而不会显示在屏幕上。使用这种方法,我们还可以选择渲染纹理的分辨率、滤波模式等纹理属性。
  2. 在屏幕后处理时使用GrabPass命令OnRenderImage函数来获取当前屏幕图像,Unity会把这个屏幕图像放到一张和屏幕分辨率等同的渲染纹理中,下面我们可以在自定义的Pass中把它们当成普通的纹理来处理,从而实现各种屏幕特效。

渲染纹理vs. GrabPass:

  • 简便性:GrabPass的好处在于实现简单,我们只需要在Shader中写几行代码就可以实现抓取屏幕的目的。而要使用渲染纹理的话,我们首先需要创建一个渲染纹理和一个额外的摄像机,再把该摄像机的Render Target设置为新建的渲染纹理对象,最后把该渲染纹理传递给相应的Shader。
  • 效率:使用渲染纹理的效率往往要好于GrabPass,尤其在移动设备上。使用渲染纹理我们可以自定义渲染纹理的大小,尽管这种方法需要把部分场景再次渲染一遍,但我们可以通过调整摄像机的渲染层来减少二次渲染时的场景大小,或使用其他方法来控制摄像机是否需要开启。而使用GrabPass获取到的图像分辨率和显示屏幕是一致的,这意味着在一些高分辨率的设备上可能会造成严重的带宽影响。而且在移动设备上,GrabPass虽然不会重新渲染场景,但它往往需要CPU直接读取后备缓冲

渲染纹理应用

1.镜子效果

镜子实现的原理很简单,它使用一个渲染纹理作为输入属性,并把该渲染纹理在水平方向上翻转后直接显示到物体上即可。

Shader关键代码:

Shader "ShaderBook/Chapter10/Mirror" {
	Properties {
		//摄像机对应的 Render Texture
		_MainTex ("Main Tex", 2D) = "white" {}
	}
	SubShader {
		Tags { "RenderType"="Opaque" "Queue"="Geometry"}		
		Pass {
			CGPROGRAM
			......			
			sampler2D _MainTex;			
			......
			v2f vert(a2v v) {
				......				
				o.uv = v.texcoord;
				//翻转了x分量的纹理坐标
				//这是因为,镜子里显示的图像都是左右相反的
				o.uv.x = 1 - o.uv.x;				
				return o;
			}			
			fixed4 frag(v2f i) : SV_Target {
				//返回从渲染纹理中采样的结果
				return tex2D(_MainTex, i.uv);
			}			
			ENDCG
		}
	} 
 	FallBack Off
}

在这里插入图片描述
在这里插入图片描述

2.玻璃效果

在Unity中,我们还可以在Unity Shader中使用GrabPass来完成获取屏幕图像的目的。当我们在Shader中定义了一个GrabPass后,Unity会把当前屏幕的图像绘制在一张纹理中,以便我们在后续的Pass中访问它。

我们通常会使用GrabPass来实现诸如玻璃等透明材质的模拟,与使用简单的透明混合不同,使用GrabPass可以让我们对该物体后面的图像进行更复杂的处理,例如使用法线来模拟折射效果,而不再是简单的和原屏幕颜色进行混合。

扫描二维码关注公众号,回复: 11086544 查看本文章

GrabPass支持两种形式:

  • 直接使用GrabPass { },然后在后续的Pass中直接使用_GrabTexture来访问屏幕图像。但是,当场景中有多个物体都使用了这样的形式来抓取屏幕时,这种方法的性能消耗比较大,因为对于每一个使用它的物体,Unity都会为它单独进行一次昂贵的屏幕抓取操作。但这种方法可以让每个物体得到不同的屏幕图像,这取决于它们的渲染队列及渲染它们时当前的屏幕缓冲中的颜色。
  • 使用GrabPass { “TextureName” },正如本节中的实现,我们可以在后续的Pass中使用TextureName来访问屏幕图像。使用这种方法同样可以抓取屏幕,但Unity只会在每一帧时为第一个使用名为TextureName的纹理的物体执行一次抓取屏幕的操作,而这个纹理同样可以在其他Pass中被访问。这种方法更高效,因为不管场景中有多少物体使用了该命令,每一帧中Unity都只会执行一次抓取工作,但这也意味着所有物体都会使用同一张屏幕图像。不过,在大多数情况下这已经足够了

Shader关键代码:法线贴图+环境映射(反射)+折射

Shader "Unity Shaders Book/Chapter 10/Glass Refraction" {
	Properties {
		......
		_BumpMap ("Normal Map", 2D) = "bump" {}
		_Cubemap ("Environment Cubemap", Cube) = "_Skybox" {}
		//用于控制模拟折射时图像的扭曲程度
		_Distortion ("Distortion", Range(0, 100)) = 10
		//用于控制折射程度
		//当_RefractAmount值为0时,该玻璃只包含反射效果,当_RefractAmount值为1时,该玻璃只包括折射效果
		_RefractAmount ("Refract Amount", Range(0.0, 1.0)) = 1.0
	}
	SubShader {
		//必须设置渲染队列为透明,这样其他物体才会在此物体前渲染
		//设置RenderType则是为了在使用着色器替换(Shader Replacement)时,该物体可以在需要时被正确渲染
		Tags { "Queue"="Transparent" "RenderType"="Opaque" }
		
		//字符串内部的名称决定了抓取得到的屏幕图像将会被存入哪个纹理中
		GrabPass { "_RefractionTex" }
				
		Pass {		
			CGPROGRAM
			......
			sampler2D _BumpMap;
			float4 _BumpMap_ST;
			samplerCUBE _Cubemap;
			float _Distortion;
			fixed _RefractAmount;
			sampler2D _RefractionTex;
			//得到该纹理的纹素大小,例如一个大小为256×512的纹理,它的纹素大小为(1/256, 1/512)
			//我们需要在对屏幕图像的采样坐标进行偏移时使用该变量
			float4 _RefractionTex_TexelSize;
			......						
			v2f vert (a2v v) {
				v2f o;
				o.pos = UnityObjectToClipPos(v.vertex);				
				//调用内置的ComputeGrabScreenPos函数来得到对应被抓取的屏幕图像的采样坐标
				//针对平台差异造成的采样坐标问题做了处理
				o.scrPos = ComputeGrabScreenPos(o.pos);
				......
				return o;
			}
			fixed4 frag (v2f i) : SV_Target {						
				//从切线空间的贴图获取法线
				fixed3 bump = UnpackNormal(tex2D(_BumpMap, i.uv.zw));					
				//模拟折射效果
				//使用法线和_Distortion属性以及_RefractionTex_TexelSize来对屏幕图像的采样坐标进行偏移,
				float2 offset = bump.xy * _Distortion * _RefractionTex_TexelSize.xy;
				i.scrPos.xy = offset * i.scrPos.z + i.scrPos.xy;
				//对scrPos透视除法得到真正的屏幕坐标
				//使用该坐标对抓取的屏幕图像_RefractionTex进行采样,得到模拟的折射颜色
				fixed3 refrCol = tex2D(_RefractionTex, i.scrPos.xy/i.scrPos.w).rgb;				
				//把法线转移到世界空间
				bump = normalize(half3(dot(i.TtoW0.xyz, bump), dot(i.TtoW1.xyz, bump), dot(i.TtoW2.xyz, bump)));
				fixed3 reflDir = reflect(-worldViewDir, bump);
				fixed4 texColor = tex2D(_MainTex, i.uv.xy);
				//使用反射方向对Cubemap进行采样,并把结果和主纹理颜色相乘后得到反射颜色
				fixed3 reflCol = texCUBE(_Cubemap, reflDir).rgb * texColor.rgb;		
				//使用_RefractAmount属性对反射和折射颜色进行混合		
				fixed3 finalColor = reflCol * (1 - _RefractAmount) + refrCol * _RefractAmount;				
				return fixed4(finalColor, 1);
			}			
			ENDCG
		}
	}	
	FallBack "Diffuse"
}

添加Cubemap,设置Refract Amount为0:
在这里插入图片描述
调整Refract Amount后:
在这里插入图片描述

发布了195 篇原创文章 · 获赞 59 · 访问量 10万+

猜你喜欢

转载自blog.csdn.net/qq_36622009/article/details/105564774
今日推荐