小玩意系列之挖个洞

演示效果

digahole.gif

链接地址

所有小玩意系列都在这个合集中:
https://gitee.com/ruanwujing/green-pack-cocos

示例场景位置

scenes/digahole场景

使用方式

开箱即用,随意将一个3d对象,例如新建一个球,然后将材质换成hole,即可用这个球对其他的3d对象进行愉快地挖洞了。

原理

这是在被挖平面之上的冒出的部分:
image
这是被埋在被挖平面之下的部分:
image
我们要做出挖洞效果,能看到的洞口是二者的交集:
image
1要渲染被挖对象之下的部分很容易。3d模型渲染时,默认有个深度测试。所谓深度,是一个被渲染点到摄像机的距离计算出来的值。这个值越大,当前点距离摄像机越远。
默认状况下,一般的渲染中,深度测试判定都是less,也就是说当前点的深度比缓存中小时才渲染,也就是说当前点离相机的距离比之前的渲染对象这个点离相机的距离更近,所以要渲染它。
这里我们将挖洞shader的深度测试改成greater,这样就能反向获得被其他模型阻挡住的部分。
image
2挖洞对象之上的部分这个稍微有点绕。为了筛选出这部分。我给材质最前面再加了一个pass,通过这个pass往缓冲中写入一个深度,并关闭它的深度写入以免影响后续渲染:
image
并加这个pass的混合模式调整,让它实际上没有任何显示上的渲染输出
image
然后在要渲染用的那个pass中,添加模版测试。
image
3背面部分的显示,光影是不对的,这是因为法线一般是从模型内部超模型外的方向。我们现在要渲染模型背面的部分,所以要将法线取个反:
image

使用总结

如果你用一般的默认的材质,可以直接换成这个hole材质。因为这是用新建出来的标准表面着色器改的。修改的内容可以对比一下,没有很多。
如果你要挖洞的对象有自己做好的材质,那么就需要麻烦一点,对着这个挖洞原理,自己对shader进行一下修改。

2赞

:heart_eyes: mark~,大佬真棒!

1赞

:heart_eyes:干货!