《入门精要》中模拟玻璃是用了Unity里的一个特殊的Pass来实现的，这个Pass就是GrabPass，比起上一篇博客实现镜子的方法，这个方法我认为相对复杂，因此在实现之前需要对GrabPass及实现原理做一个更加详细的介绍。
1 效果及代码
1.1 效果
1.2 Shader完整代码
Shader "Unity Shaders Book/Chapter 10/GlassRefraction"
{
//Properties
Properties {
_MainTex ("Main Tex", 2D) = "white" {} //玻璃材质纹理
_Cubemap ("EM", Cube) = "_Skybox" {}
_BumpMap ("Bump Map", 2D) = "bump" {} //玻璃法线纹理
//control the distortion of refraction
_Distortion ("Distortion", range(0, 100)) = 10
_RefractAmount ("Refract Amount", Range(0.0, 1.0)) = 1.0
}
SubShader {
//Queue must be transparent, opaque objects will be drawn before
Tags { "Queue"="Transparent" "RenderType"="Opaque" }
//define a pass to grab the screen behind the object,
//see the result by using "_RefractionTex"
GrabPass {"_RefractionTex"}
Pass {
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "Lighting.cginc"
#include "AutoLight.cginc"
//Properties
sampler2D _MainTex;
float4 _MainTex_ST;
samplerCUBE _Cubemap;
sampler2D _BumpMap;
float4 _BumpMap_ST;
float _Distortion;
fixed _RefractAmount;
//remember to add:
sampler2D _RefractionTex;
//get the texel size:
float4 _RefractionTex_TexelSize;
struct a2v {
float4 vertex : POSITION;
float3 normal : NORMAL;
float4 texcoord : TEXCOORD0;
float4 tangent : TANGENT;
};
struct v2f {
float4 pos : SV_POSITION;
float4 uv : TEXCOORD0;
float4 TtoW0 : TEXCOORD1;
float4 TtoW1 : TEXCOORD2;
float4 TtoW2 : TEXCOORD3;
float4 srcPos : TEXCOORD4;
};
v2f vert(a2v v) {
v2f o;
o.pos = UnityObjectToClipPos(v.vertex);
//抓取屏幕图像的采样坐标
o.srcPos = ComputeGrabScreenPos(o.pos);
o.uv.xy = TRANSFORM_TEX(v.texcoord, _MainTex);
o.uv.zw = TRANSFORM_TEX(v.texcoord, _BumpMap);
float3 worldPos = mul(unity_ObjectToWorld, v.vertex).xyz;
float3 worldNormal = UnityObjectToWorldNormal(v.normal).xyz;
float3 worldTangent = UnityObjectToWorldNormal(v.tangent).xyz;
float3 worldBinormal = cross(worldNormal, worldTangent) * v.tangent.w;
//计算切线空间 -> 世界空间的矩阵，只需要3x3
//按列摆放
o.TtoW0 = float4(worldTangent.x, worldBinormal.x, worldNormal.x, worldPos.x);
o.TtoW1 = float4(worldTangent.y, worldBinormal.y, worldNormal.y, worldPos.y);
o.TtoW2 = float4(worldTangent.z, worldBinormal.z, worldNormal.z, worldPos.z);
return o;
}
fixed4 frag(v2f i) :SV_Target {
float3 worldPos = float3(i.TtoW0.w, i.TtoW1.w, i.TtoW2.w);
//计算光照需要参数：
fixed3 worldlightDir = normalize(UnityWorldSpaceLightDir(worldPos));
fixed3 worldviewDir = normalize(UnityWorldSpaceViewDir(worldPos));
//对纹理采样+解码，得到法线方向
fixed3 bump = UnpackNormal(tex2D(_BumpMap, i.uv.zw));
//由于这里需要模拟的是玻璃的折射效果，因此不能是这种常规的法线纹理的偏移：
//bump.xy *= _BumpScale;
//bump.z = sqrt(1.0 - saturate(dot(bump.xy, bump.xy)));
//开始实现折射效果
float2 offset = bump.xy * _Distortion * _RefractionTex_TexelSize.xy;
i.srcPos.xy = offset + i.srcPos.xy;
//采样得到“折射”颜色:
fixed3 refractColor = tex2D(_RefractionTex, i.srcPos.xy/i.srcPos.w).rgb;
bump = normalize(half3(dot(i.TtoW0.xyz, bump), dot(i.TtoW1.xyz, bump), dot(i.TtoW2.xyz, bump)));
//开始环境映射：
fixed3 reflectDir = reflect(-worldviewDir, bump);
fixed4 texColor = tex2D(_MainTex, i.uv.xy);
fixed3 reflectColor = texCUBE(_Cubemap, reflectDir).rgb * texColor.rgb;
fixed3 finalColor = reflectColor * (1 - _RefractAmount) + refractColor * _RefractAmount;
return fixed4(finalColor, 1.0);
}
ENDCG
}
}
FallBack "Diffuse"
}
2 一些重点过程
2.1 制作场景
场景物体拜访和贴图完全参考《入门精要》：
以及当前场景的Cubemap的创建：由于相同项目下之前已经在Assets -> Edit加了一个可以获取场景中某个GameObject角度的Cubemap，直接按照相似的方法创建了创建过程可以参考【Unity Shader】Unity中如何创建Cubemap？
2.2 关于渲染队列设置
乍一看，SubShader的标签设置好像是前后矛盾的， 渲染队列Queue是Transparent透明的，而当前shader的渲染类型RenderType确是不透明：
Tags { "Queue"="Transparent" "RenderType"="Opaque" }
GrabPass {"_RefractionTex"}设置Queue的作用
我们上效果，如果不加上"Queue"="Transparent"，效果如下：
当前的Shader是挂在外面的Cube上的，从上图效果和1.1的效果对比可以看出，Queue设置为Transparent是为了保证当前屏幕空间画面里的比Cube深度大、但是是不透明的物体（默认的Queue就是不透明）也能渲染并呈现出来，达到“透过玻璃观察”的效果。
设置RenderType的作用
还跟上面一样，假设把"RenderType"="Opaque"去掉，会发现效果跟1.1的没有任何变化。这是因为！RenderType其实是提前给当前的Shader归类了，为了方便之后使用着色器替换（Shader Relacement）的时候，当前Shader能被正确的使用。至于什么是着色器替换，后面会涉及到，这里就先不解释了，挖个坑以后填。
2.3 2种GrabPass的使用方法
参考ShaderLab：GrabPass - Unity 手册，从官方文档中可知GrabPass是ShaderLab语法中的一员，是包含在SubShader内的一种特殊的通道类型，它直接定义了一个额外的抓取屏幕图像的Pass，把即将绘制对象时的屏幕内容抓取到某个纹理中，这个纹理可以在后面的Pass中被使用去做一些效果。它的使用方式通常有两种：
GrabPass {}
即直接在Pass语义块前添加GrabPass {}，{}里啥也不写，那么后续抓取屏幕图像的Pass会使用_GrabTexture来访问屏幕图像。这种方法看似方便，省去了定义一个新texture的麻烦。但当场景中多个物体都需要这种形式来抓取屏幕时（我理解的是有多个物体需要做出类似“玻璃”的效果），Unity都会为每个物体单独执行一次这个Pass的抓取操作，每个物体都会生成属于自己的_GrabTexture，这样的效果虽好，但代价是很大的。
GrabPass {"TextureName"}
就像上述代码中的：
GrabPass {"_RefractionTex"}给我们Pass抓取屏幕图像定义一个专属的、名为"_RefractionTex"的纹理，后续的Pass中如果需要使用，就可以通过这个名称来访问抓取屏幕图像的纹理啦！比如上述代码中的：
fixed3 refractColor = tex2D(_RefractionTex, i.srcPos.xy/i.srcPos.w).rgb;就是直接使用了定义的纹理名称来访问这个纹理。这样使用方法的好处是，同一个屏幕下多个需要GrabPass的物体都使用同一次渲染出的纹理，也就是仅进行一次GrabPass的抓取图像操作，这样就可以大大节省消耗！而且大部分情况下，都使用一张抓取的图像已经能满足效果需求了。
二者的对比
这里我们还是用到了Unity提供的Frame Debug，同时为了更好的对比效果，我在场景中多添加了一个想实现透明效果的Cube，这里仅看透明物体的渲染步骤。
使用GrabPass {"_RefractionTex"}时，可以发现步骤中两个Cube是共用同一张Texture的，仅Grab了一次：
而当使用GrabPass {}时，Grab了两次：
两次的RenderTexuter分别是：
二者的消耗对比（左GrabPass {"_RefractionTex"}；右GrabPass {}），可以发现右边消耗明显比左边大：
2.4 获取纹素大小：_TexelSize
这里是为了提一提Shader中定义的：
//get the texel size:
float4 _RefractionTex_TexelSize;以后的使用中如果想要获取某张纹理的纹素大小，就可以在纹理名称后加上_TexelSize啦！这个有点类似_MainTex_ST，都是Unity Shader的内置属性~
2.5 ComputerGrabScreenPos函数
这是一个Unity Shader的内置函数，ComputerGrabScreenPos()括号中输入裁剪空间下的顶点位置坐标，可以得到当前被抓取的屏幕图像的屏幕坐标。关于屏幕坐标获得好像有另一个函数？——ComputerScreenPos，那么问题来了：为什么不用ComputerScreenPos？关于这个问题，可以先保留着，我将在接下来的博客中仔细说明（又给自己挖了一个坑。。。）这里仅需要知道ComputerGrabScreenPos()的作用就行！
2.6 如何实现折射效果？
关于折射，我们好像真的学过并使用过一个折射相关的Unity内置函数——Refract(i, n, ri)，但这里实现折射并不是真的要实现折射光的效果（太消耗啦！），而是采用GrabPass+给屏幕坐标一个偏移的方式实现玻璃的折射效果。
GrabPass在前面已经介绍过了，这里过一遍如何给屏幕坐标偏移，主要体现在如下代码：
fixed3 bump = UnpackNormal(tex2D(_BumpMap, i.uv.zw));
//由于这里需要模拟的是玻璃的折射效果，因此不能是这种常规的法线纹理的偏移：
//bump.xy *= _BumpScale;
//bump.z = sqrt(1.0 - saturate(dot(bump.xy, bump.xy)));
//开始实现折射效果
float2 offset = bump.xy * _Distortion * _RefractionTex_TexelSize.xy;
i.srcPos.xy = offset + i.srcPos.xy;
//采样得到“折射”颜色:
fixed3 refractColor = tex2D(_RefractionTex, i.srcPos.xy/i.srcPos.w).rgb;对bump偏移
如果不记得如何在世界空间使用法线纹理了，可以先去看看【Unity Shader】纹理实践5.0：世界空间下使用法线纹理，如果仅实现法线纹理但并不考虑玻璃效果，直接给bump一个传统的变化就行，但这里需要加上玻璃的折射效果，因此还需要结合定义的_Distortion变量和_RefractionTex_TexelSize变量对bump“做手脚”。
- _Distorion——控制折射的扭曲程度，其实它的道理跟传统应用中的“_BumpScale”是一样的
- _RefractionTex_TexelSize——偏移量的大小，当然是根据纹理坐标而偏移
获取折射颜色
tex2D(_RefractionTex, i.srcPos.xy/i.srcPos.w)这里用了一个透视除法！这里涉及到了如何在Unity中获取片元在屏幕上的像素位置，这一点之前在学习基础理论时忽略了，后期会再补上，这里就不赘述（好家伙，又挖了一个坑。。。）。
最终呈现的颜色
fixed3 finalColor = reflectColor * (1 - _RefractAmount) + refractColor * _RefractAmount;这里用了一个_RefractAmount巧妙地控制了折射和反射的占比（跟之前的环境映射中实现折射效果一样的操作），其实就是一个自行给定的菲涅尔项。
关于实现玻璃效果的过程梳理到这就结束啦！文章来源：https://www.toymoban.com/news/detail-488969.html
后面会再出一个关于Unity中GrabPass的使用、包括GrabPass和AlphaBlend的区别、URP下的GrabPass实现方案等等，以及《入门精要》中提到的一个Command Buffers这个新概念，这些点真的有太多太多可以学习的内容了。文章来源地址https://www.toymoban.com/news/detail-488969.html
到了这里，关于【Unity Shader】Unity中利用GrabPass实现玻璃效果的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
