2.5D UserControl for Silverlight 2

2.5D (two-and-a-half D) is a way of using 2D objects to give a very convincing illusion of 3D. I’ve provided an implementation that has no lighting, materials, lines or polygons. But it does enable you to locate 2D (that is, flat) objects at x,y,z coordinates and place the camera where you want it. The implementation then projects the objects onto the camera, scaling and translating them appropriately, and handles mouse input to move the camera.

You can see a small example demonstrating this below:

Get Microsoft Silverlight

Holding the left mouse button and moving the mouse rotates the camera; holding down Ctrl zooms; holding down Shift adjusts the field of view.

Often, rotation causes an object to come in front of another, in terms of their distance from the camera. So each time it draws the scene, the implementation calculates the distance of each object from the camera and then sorts and draws them from back to front. It also culls (that is, removes from the scene) any object behind the camera. Other frills this implementation has are a kind of depth-of-field effect and a fog effect. The depth-of-field effect can be seen whenever an object gets very close to the camera: in this case its opacity falls off exponentially. The fog effect causes the saturation of distant objects to reduce, and their brightness to increase, so that they appear to be melting into fog or haze.

Anyway, you can download the source for the above project from the following location:


folderfiles Download 2.5D User Control Source

You can use Expression Blend 2 SP1 and Visual Studio 2008 to dive into the app and see how

TwoAndAHalfDUC (the first class in the file TwoAndAHalfDUC.cs) is a UserControl base class from which you can derive your own classes. In that same file you will find the CubeUC class that derives from TwoAndAHalfDUC to provide an example of what to do. All you need to do is provide an override of the InitializeSprites method that creates and initializes a number of TwoAndAHalfDSprite objects.

The base class always draws the sprites as colored circles (and of course it does this from any viewing angle so the objects behave as spheres would) but you can amend that behavior so that other 2D objects are used. I tried TextBlocks (and scaled them via their RenderTransform) and the result was very interesting.

Enjoy!

Steve