A Fog of War, in few steps.

Hi this is my very fisrt tutorial, I espect be useful.

The first step for your F.O.W. I'd created a new layer, in the top of other layers and under GUI layer if you have it. Just like image below

(SEE FOW_01.png) in gallery.

Set the layer properties like this, for FOW color change the filter color to your choice.

(SEE FOW_02.png) in gallery.

Then create a Canvas Object and make it the size of layout of map, and setup its properties like this. Don't forget to clear canvas.

(SEE FOW_03.png) in gallery.

Afterwards, will create an Sprite object for FOW eraser just like that. The Shape of eraser is of your choice, i set it as circle.

(SEE FOW_04.png) in gallery.

Finally for test our FOW, i use MouseKeyboard Object to move and paste the FOWeraser into the Canvas FOW. The combination of Eraser Effect of Canvas with no trasnparency of FOW Layer will create the FOW FX, letting us to see the layer under FOW layer.

(SEE FOW_05.png) in gallery.

I doing it every 1000 to have a little delay in FOW FX.

FOW Turorial Gallery

.cap file

I espect this be usegul for anyone. Thanks! coming soon more Tutorials.

I'd noticed an VRAM issue for big maps, my case layout about 5000x5000 pxl i'm using a canvas of internal image about 512*512 pxl, then resized in the editor to the size of layout, the VRAM usage is about 112 MB that is too much for me, i'm working to improve the FOW implementation, coming soon i'll publish a new method.

Thanks!

Are you aware of the effect "Color Fusion (Masked)"? It can help tremendously with creating a fog of war.

Will post an example soon.

EDIT: Here is an example.