如何为物体加上轮廓效果
本文参考自教程,加上自己的一点心得体会。教程里的做法是使用了Unity的Post Processing Stack,这里并没有使用,而是用的自己写的脚本,调用OnRenderImage
实现后处理。
首先,为什么要用后处理的方式去实现轮廓效果呢?这里,效果的实现依赖于对屏幕空间中相邻的若干点进行采样,获得深度或者法线信息。而如果用常规的方式去实现,frag里只能拿到物体的screenPos,然后通过tex2Dproj去采样,拿不到相邻点信息的。
那么,在frag里需要做哪些事情呢?我们定义的轮廓基于以下事实:如果相邻的若干点采样出的值差异过大,那么此处就存在轮廓。这里我们使用深度值和法线来作为衡量标准。我们定义_Scale
作为相邻像素的距离,_Scale
越大,距离越远。相关代码如下:
float halfScaleFloor = floor(0.5 * _Scale);
float halfScaleCeil = ceil(0.5 * _Scale);
float2 bottomLeftUV = i.uv - _MainTex_TexelSize.xy * halfScaleFloor;
float2 topRightUV = i.uv + _MainTex_TexelSize.xy * halfScaleCeil;
float2 bottomRightUV = i.uv + _MainTex_TexelSize.xy * float2(halfScaleCeil, -halfScaleFloor);
float2 topLeftUV = i.uv + _MainTex_TexelSize.xy * float2(-halfScaleFloor, halfScaleCeil);
可以发现,当_Scale
为奇数\(2k+1\)时,halfScaleFloor
的值为\(k\),halfScaleCeil
的值为\(k+1\);当_Scale
为偶数\(2k\)时,halfScaleFloor
和halfScaleCeil
的值均为\(k\)。这样可以保证,采样像素永远位于四个相邻像素的中心,而且,两个距离最远的相邻像素的距离一定为halfScaleFloor + halfScaleCeil = _Scale
。
然后,我们采样这四个相邻像素的深度值,计算对角的深度差:
float edgeDepth = sqrt(pow(depth0 - depth1, 2) + pow(depth2 - depth3, 2)) * 100;
return edgeDepth;
这里,乘以100是因为采样的深度值都在0~1之间,差值会比较小。效果如下:
从图中可以看到,有一些物体的平面仍然被绘制出来,呈现深灰区域,为了将其抹去,我们可以给edgeDepth
设定一个阈值,高于阈值才会保留:
但是这样又有一个问题,就是一些本来是轮廓的地方也被抹去了。考虑到用一个阈值不太准确,因为离相机越近的物体,深度值越小,越远的物体,深度值越大,而深度值的分布又是不均匀的,这就存在一种情况,就是距离相同的两个物体,离相机越远,实际深度的差值越小(如下图)。因此,有必要将物体本身的深度值考虑进来,即阈值与物体本身的深度值有关,深度越大,阈值越大:
float depthThresold = _DepthThresold * depth0;
edgeDepth = edgeDepth > depthThresold ? 1 : 0;
改进后的效果如下:
但现在好像又有些矫枉过正,cube的顶面和侧面被当作轮廓绘制出来,楼梯的一部分轮廓被抹去了。这时就需要借助法线了。通过对四个相邻点采样法线,按照深度值类似的方式进行处理,取差值的max:
现在就剩下一些平面被当作轮廓绘制了,为了解决这个问题,需要引入视线向量。当视线向量与平面法线的夹角越小时,深度的阈值越低;反之,夹角越大,阈值越高。这样就可以避免剩下一些几乎与视线齐平的平面被当作轮廓绘制。最终的深度阈值是如下的形式:
float depthThresold = _DepthThresold * depth0 * nDotL;
我们对nDotL
进行了调制:
float nDotL = 1 - viewDir * viewNormal;
nDotL = saturate((nDotL - _NDotLThresold) / (1 - _NDotLThresold)) * _NDotLScale + _NDotLOffset;
其中,_NDotLOffset
是一个初始值,保证最终nDotL
的最小值。saturate((nDotL - _NDotLThresold) / (1 - _NDotLThresold))
是用来限制nDotL
的生效范围,只有大于等于_NDotLThresold
阈值的才会生效,并重新映射到\([0,1]\)范围内。_NDotLScale
是用来控制nDotL
影响幅度的值。
最后,把物体自身的颜色与轮廓进行混合: