Lighting Covering Up Sky ( XNA / C# )

Question

I have a 2D tile-based lighting system which is drawn onto a Render Target. I am also drawing a background which involves mountains, sun/moon, and clouds. There is also the unlit game; blocks, character, etc.

Here is the order in which everything is drawn:

1. Background
2. Game World
3. Lighting

The problem is that the LIGHTING is covering up the BACKGROUND when it's dark:

Although it's perfectly fine in the day because the light is full:

You might ask, well, why don't you just blend each block, not drawing the lighting on a RenderTarget?

Because that would prevent me from performing smooth lighting, as seen in the pictures. To produce the smooth lighting, I draw squares of light onto a RenderTarget, perform a Gaussian blur and then draw that RenderTarget.

How about not drawing a square of light in empty spaces?

The light blurs onto any adjacent blocks, and not all objects in my game affected by lighting are square, so they would look like a sprite with a blurry square on top of it.

Light NOT being drawn in empty spaces:

Light being drawn everywhere:

Is there any way to keep the background visible, or something else that would help my predicament?

USING THE STENCIL BUFFER

I put in the stencil buffer code that you said should cause "little overhead"

As you can see the background blocks, due to the effect, are not darkened like they should be. The FPS here is ~15 as opposed the the steady 60 FPS it runs at without the stencil method. Also the character is somehow not being drawn correctly.

It does in fact work though despite the more than annoying lag.

Answer 1

The issue seems to be that you are applying lighting to an object which should not be affected by it. It makes no logical sense that something in the local scene should be able to affect the sky, like the shadows in your sample do during the day. I think this doesn't make logical sense but perhaps it does make aesthetic sense.

If I have understood correctly what you want, then you should consider the following method:-

1. Break your system into two sets; things you want affected by lighting and things you don't want affected.

2. Render the set of light affected objects to a stencil buffer (for implementation details see this tutorial).

   • You should add this to the system that currently renders the scene and simply enable and disable writing to the stencil buffer depending on whether you want lighting on the object you are currently drawing.

3. Use this stencil buffer when rendering the lighting buffer to only draw to areas that you want shadows (pixels occupied by objects we want illuminated).

What this will do is make sure that you only render lighting to pixels which are used to display an object affected by lighting and not pixels being used to display the sky.

At the end your draw method should resemble (code taken from here);

var a = new AlphaTestEffect(graphics.GraphicsDevice) {
    Projection = m
};

var s1 = new DepthStencilState {
    StencilEnable = true,
    StencilFunction = CompareFunction.Always,
    StencilPass = StencilOperation.Replace,
    ReferenceStencil = 1,
    DepthBufferEnable = false,
};

var s2 = new DepthStencilState {
    StencilEnable = true,
    StencilFunction = CompareFunction.LessEqual,
    StencilPass = StencilOperation.Keep,
    ReferenceStencil = 1,
    DepthBufferEnable = false,
};

// not drawing to the stencil buffer here
spriteBatch.Begin(SpriteSortMode.Immediate, null, null, null, null, a);
// draw all NON-light affected objects here 
foreach (Sprite s in nonIlluminatedSprites)
{
    spriteBatch.Draw(s.texture, s.rectangle, Color.White);
}
spriteBatch.End();

// drawing to the stencil buffer here...
spriteBatch.Begin(SpriteSortMode.Immediate, null, null, s1, null, a);
// draw all light affected objects here  
foreach (Sprite s in illuminatedSprites)
{
    spriteBatch.Draw(s.texture, s.rectangle, Color.White);
}
spriteBatch.End();

// using the mask here
spriteBatch.Begin(SpriteSortMode.Immediate, null, null, s2, null, a);            
// Blend the light buffer with scene here
spriteBatch.Draw(lightBuffer.texture, Vector2.zero, Color.White);
spriteBatch.End();

Note: while a sky/mountain backdrop might not be affected by shadows you may want to have shadows cast on other background objects; such as the background walls when the game is an interior location like a house. So you might want to split the background into two things, background objects and sky/mountain backdrop.

Alternative Method

In a comment it was mentioned that the stencil buffer approach was being slow. This shouldn't be the case if generated in the same pass as rendering the main game objects as it should add very little overhead. However, there may be another method in this particular case.

If you are using a pixel shader to render all scene objects then add a new "float illuminate" attribute. Before the draw call for a non-illuminated object set this attribute to 1 and before the draw call for illuminated objects set it to 0. Then, in the pixel shader, set the alpha channel of the lighting buffer to this value.

This should mean that when you blend using alpha blending at the end of your rendering pass the lighting buffer will have transparent areas where we don't want illumination applied on the screen.

Note: I may have the 1 and 0 round the wrong way. I get this wrong most of the time and wrote this assuming that 1 means "completely transparent".