0x00 About && 关于

战雾，迷雾效果，还是比较常见的游戏特效。该组件主要提供了几种常见的战雾的类型，方便开发者直接使用。

该组件的迷雾基于 tile，原理十分简单，每次根据用户选定的风格，把(包含)指定的中心位置周围的部分，借助 cc.Mask 的帮助，使其可见。

组件对每次打开的 tile 部分有做优化处理，因此效率还是比较高的。

项目中包含两个测试场景。

一个是常规的，cc.Mask + SSRFogOfWarComponent 实现的战雾效果的演示。

另一个是借助了之前自己制作的 [FBO 插件])(https://store.cocos.com/app/detail/2528) 中的 Target 模式，加上 Shader ，实现战雾边缘的简单的羽化效果。

0x01 RevealStyle && 打开迷雾风格

Dimond Style / 钻石形风格

Rect Style / 矩形风格

0x02 TileStyle && 迷雾单元风格

Circle Style / 圆形风格

Rect Style / 矩形风格

0x03 FBO Shader Style

项目中的 [FBOFoW] 演示了上面提到过的

cc.Mask + FBO + Shader + SSRFogOfWarComponent

实现的带模糊效果的战雾演示。

下面是该 Demo 在微信小程序上的实机效果:

https://www.bilibili.com/video/BV1364y1U7qn/

关于 FBO 的使用方式，可以查看我之前发的插件中 FBONodeTargetComponent 相关的内容。

0x04 Platform Support && 平台支持

目前测试过的平台，设备，相关信息。

引擎版本

Creator v2.4.3

Creator v2.4.4

测试设备

Model.1

2018 产

MacBook Pro (13-inch)

macOS Catalina 10.15.6

Google Chrome 版本 85.0.4183.83（正式版本）（64 位）

Firefox 80.0.1 (64 位)

Safari 版本13.1.2 (15609.3.5.1.3)

Model.2

2017 产

iPhone X 13.3.1 MQA92CH/A

Model.3

2017 产

Huawei Honor 7X BND-AL10 Android 9.0 EMUI 9.1.0

发布平台

Web Desktop

Wechat Game 稳定版 Stable Build 1.03.2010240

---

请注意，SSRFogOfWarComponent 中只包含了 FBO插件 中 FBONodeTargetComponent 的源码部分。

如果有兴趣的用户，也可以考虑直接购买 [FBO插件]，里面同样包含了 SSRFogOfWarComponent 组件，以及其它更多的演示程序。

---

下面是作者的其他一些插件，如果有感兴趣的，可以支持一下，感谢 ~