Debug – What’s happening?

The purporse of this post is to create 4 small windows which will allow us to see each stage of the scene whilst it is being rendererd. I’m just going to jump straight in with the code. In the “DeferredRenderer” class, define a new variable:

private SpriteBatch spriteBatch;

This will be used to render our RenderTargets for debugging. We can also use this later on for PostProcessing effects. In the constructor we instantiate the SpriteBatch:

spriteBatch = new SpriteBatch(device);

We now have a SpriteBatch that we can use to render the different RenderTargets. Find your Draw method and add the following at the end:

DrawDebug();

Just after your Draw method, let’s create the new DrawDebug method:

void DrawDebug()
{
}

The first part of the method we’ll create a Rectangle that we’ll use to output the textures to screen:

int width = 128;
int height = 128;

Rectangle rect = new Rectangle(0, 0, width, height);

The width and height values are changable, dependant on the screen resolution that the application is running. We will look at configuring the screen resolution later on in the project. Going back to the code, we now have a Rectangle that starts in the top left hand corner of the screen, but nothing has been drawn yet. Let’s add the code to do this:

// Tell the SpriteBatch that we want to start drawing
spriteBatch.Begin(SpriteSortMode.Immediate, BlendState.Opaque, SamplerState.PointClamp, null, null);

// Draw Color RenderTarget
spriteBatch.Draw((Texture2D)colorRT, rect, Color.White);

// Increment the X value, so we are moving the left hand side of the Rectangle by 128.
// This stops us from drawing over the top of the first RenderTarget
rect.X += width;

// Draw Normal RenderTarget
spriteBatch.Draw((Texture2D)normalRT, rect, Color.White);

// Again, move the Rectangle
rect.X += width;

// Draw Depth RenderTarget
spriteBatch.Draw((Texture2D)depthRT, rect, Color.White);

// Flush the SpriteBatch to screen
spriteBatch.End();

Excellent. Running the code now should give you a screen like the following:

It’s not exactly attractive, but it is heading in the right direction. In the next post we’ll take a look at creating a Content Pipeline for our renderer.