平滑雾效果是如何实现的?

因为是2D游戏,所以思路基本是2D,但也有3D的思路,比如图层混合处理。主要原理是根据图片的alpha值反向擦除(当alpha为1时,完全擦除,alpha越小越不透明,实现渐变过程的效果)。最后用两个简单的方法达到这个效果,两者略有区别。用AS3实现,源码还提供了几张渐变图片,可以作为点光源打磨雾气,可以替换看到各种效果。

想到的第一个原理是基于之前实现类似点光源效果的实践。通过一层带有alpha值的蒙版贴图擦除对应的战争迷雾,就是手机版增加的点光源效果。先是人物背景,然后顶部是一层战雾,人物带点光源。那么当角色移动的时候,点光源层就不画了,所以光源层会大一些。雾自然会越来越大。?就这样,面具随着人物的移动而不断扩大。除了初始的合成蒙版图,后面的处理和前面说的新手引导蒙版和点光源的实现机制一样,后面会给出相关代码。但是,这种实现有点不好。会导致射程突然变亮(因为阿尔法相位增加到1,所以全部被擦,大部分都亮,也就是说会有逐渐变亮的效果,使得战争迷雾的开启效果不那么真实)。

直接消除战争迷雾方法(橡皮擦功能)

经过实际测试,我对蒙版擦除的效果并不满意。于是我又研究了一遍,想到了橡胶效果,直接用一些光源图片擦掉了战争的迷雾。我赶紧仔细看了相关api,确实有类似的实现效果。主要使用bitmapData的draw方法,重点是这个方法的第四个参数。所以每次在战争之雾的关卡,我们调用draw方法,将角色带来的点光源图片绘制成战争之雾的BitmapData,然后根据alpha的参数设置为擦除,露出最终的背景。