Using True Vision to Create 3D DirectX Animation in C# and .NET

Introduction

It has always been a little painful creating 3D animation using Microsoft DirectX... until now. True Vision 3D has created a nice wrapper around DirectX 9 to simplify the task of doing animation and game development in .NET. With this well defined game engine, you can get going creating moving objects right away. This article is based on a tutorial written by the author Fatima Ahmed describing how to use True Vision to create a furnished room.

Figure 1 - 3D Animation of Objects using DirectX, True Vision and .NET

Understanding the 3D World

There are a few concepts you will need to understand before tackling the world of 3D animation. Much of 3D design is based on the concept of meshes. Meshes are these wire frames described in terms of 3d vectors. You can think of a mesh as a bent up piece of chicken wire that forms the shape of the desirable object. A mesh is rendered from its vector components into a solid object using some fancy algorithms handled by Direct X. In order to give the "chicken wire" a more realistic look, the wire mesh is covered with a texture. Textures are simply bitmaps that fill in the polygons in the 3D mesh. In additions to textures and meshes, the 3D world has the concept of lighting in order to give objects an additional dimension. Colors in the scene are made lighter or darker to give the illusion of different concentrations of light. Developers often use programming tools such as 3D Studio, Lightwave 3D, or SoftImage to create meshes, textures, and other aspects of game development.

Thinking in True Vision

The concept behind DirectX (and wrapped nicely by True Vision) is that you create all these meshes as objects in your scene, and rotate, translate, color, or illuminate them separately. Anotherwords, the steps to animating meshes are this: change the meshes in your scene, render the whole scene. Then repeat: change the meshes in your scene, render the whole scene. When do you change the scene? You can change the scene in response to user input, or in response to a timer, or whatever event in your application is suitable for triggering a change.

The Program Structure

The application initializes the True Vision Engine at the time of the load event of the Windows Form. Inside the load event handler, we create all our mesh objects. Then we kick off the main loop. The main loop, which is common to all directx applications, just spins a loop that continously renders the scene filled with meshes. Rendering is handled in 3 steps: step 1) clear the previously rendered objects. step 2) render the new scene in memory 3) display the newly rendered scene on the screen. These steps continue to loop at a predetermined frame rate. The loop is exited only after the program sets the loop variable to false. In our program the loop variable is set to false when the user presses the exit button or closes the form.

Animation

In order to see some interesting animation from our mesh objects, we have to transform them. We added a routine inside the rendering loop that rotates some of the objects in our scene. You can rotate any mesh object in the scene that you want using True Vision, but we chose to rotate the dice and the sunglasses. This strange rotation of objects in the room gives you the illusion that the room is haunted. To animate, we just add a line inside the rendering loop that calls the method RotateSomeObjects. This method changes the position of the sunglasses and dice each time through the loop. At the current frame rate, the dice and sunglasses look like they are spinning.

The Code

Let's take a more detailed look at the code to understand what we talked about so far. Initialization takes place in the form load event. The first method, SetupTheInitialScene, sets up the engine, and creates the scene and all the mesh objects. The Main_Loop call starts the loop and asks the scene to render itself every time through the loop.

Listing 1 - Loading the Scene and starting the Main Loop

        private void Form1_Load(object sender, EventArgs e)
        {
            // set up the initial scene
            SetupTheInitialScene();

             // show the form and give it focus
             this.Show();
             this.Focus();

            // start up the main loop, setting the loop guard to ON
             DoLoop = true;
             Main_Loop();
        }

Let's take a look at these two methods. The SetupTheInitialScene in the form first calls the InitializeTrueVision method in our form which initializes the engine. Then the SetupTheInitialScene method sets up the lighting and textures to be used by the mesh shapes. Finally SetupTheInitialScene creates the walls and mesh shapes needed to render the scene as shown in listing 2:

Listing 2 - Setup the scene and create the mesh shapes in the room

The InitializeTrueVision called from SetupTheInitialScene, initializes the true vision engine and sets up texture and mesh path information. This method also points the engine to render inside the picturebox in our form. As you can see, initialization of the True Vision framework is pretty sttraightfoward with just a few lines of code.

Listing 3 - Initializes the True Vision Engine

The LoadTextures method called from SetupTheInitialScene brings in all the textures used in the scene as shown in listing 4. Textures are bitmaps such as jpg or bmp files. You only need to refer to the texture file's relative path because in Listing 3 we already told the engine what the search path for media would be. The call which loads the texture assigns a keyword so the texture can be referred to in the code by the keyword. For example the marble.jpg texture file loaded into the scene is assigned the keyword "marble".

Listing 4 - Loading the Textures into the Scene

Now that we have our textures, we are ready to create our mesh shapes. First we will create the room walls. Lucky for us, the True Vision engine has built-in methods to handle the creating of walls as shown in listing 5. We simply use the AddWall3D method. This method takes the texture as its first parameter. The texture id is looked up through the keyword we assigned in listing 4. Our walls are all cinder blocks, so we will bring in the cinder block texture. The next 4 parameters in the AddWall3D method specify the x and z 3d coordinate positions defining the wall rectangle. The last two parameters specify the tile dimensions of the texture. There is a separate call to draw the floor called AddFloor and before you know it we have a room! Listing 5 shows the calls for creating a mesh room and figure 2 shows the rendered result. (Note the room isn't actually rendered until the Main_Loop).

Listing 5 - Creating the room walls using the True Vision Engine

Figure 2 - The Rendered Room

Now let's see how to create all the cool shapes in our room. Listing 6 creates all the shapes in our room: 2 chairs, 2 dice, a table, a sphere, and a pair of sunglasses.

Listing 6 - Creating the interesting mesh shapes inside the Room