XBAP 3D Image Viewer (Basic 3D)

"The WPF 3-D implementation allows developers to draw, transform, and animate 3-D graphics in both markup and procedural code, using the same capabilities afforded by the platform to 2-D graphics. Developers can combine 2-D and 3-D graphics to create rich controls, provide complex illustrations of data, or enhance the user experience of an application's interface." – MSDN

Here, we're going to use the WPF 3-D to write a very simple application.

Suppose that you've written a secretariat system in which user can add the image of letters which comes from outside of the organization via fax or …, after archiving them (if the letter is two sided), every time the user wants to see this letter, you can only show one side of the letter at a time, but it would be cool if we could view this letter as a 3-D image! Isn't?

WPF is here!

Part 1 – The Basic Knowledge Of WPF 3-D Programming :

When you want to create 3-D graphics content in WPF, you'll need:

  1. Viewport3D
  2. Camera
  3. Geometry
  4. Texture
  5. Lighting
  • Viewport3D :

    3-D graphics content in WPF is encapsulated in an element named Viewport3D that can participate in the two-dimensional element structure. The graphics system treats Viewport3D as a two-dimensional visual element like many others in WPF.

  • Camera :

    The WPF supports 3 types of cameras and projections :

    • Matrix Camera: specifies the view and projection transforms as Matrix3D objects
    • Orthographic Camera: describes a viewing box whose sides are parallel
    • Perspective Camera: provides vanishing-point perspective

    Here we'll talk about perspective camera; This projection camera has some properties :

    • Field of view : this property allows you to set the horizontal field of view by degree.
    • Far/Near plane distance : this allows you to limit the range of projection.
    • Position : you'll set the position of the camera in 3-D space by this property
    • Look direction : setting a point in 3-D space which specifies where the camera is looking.(a straight line from the position of the camera to the looking direction)
    • Up direction : this property allows you to tell to the camera where is the up!

    The following figure shows a camera in 3-D space.

  • Geometry :

    To build a 3-D scene you need some objects to view, which they are defined by mesh primitives.

    What is the mesh?

    A triangle mesh or unstructured grid is a collection of vertices, edges and faces that defines the shape of a polyhedral object in 3D computer graphics.

    A mesh is represented by :

    • Positions : Collection of points in 3-D space
    • Triangle indices : only positions have not the ability to define objects, which points makes which triangles? To answer this question you need to define these indices.

      In WPF the order in which you add mesh positions is important. You'll need the index of these positions when you're defining triangles. For example if you've four position {p0, p1, p2, p3} and you want to make a triangle from p0, p2 and p3, the index values will be 0,2 and 3.

      The order which you're adding the indices is important too. This will say which side of the plane of the triangle that is defined is visible.

      Suppose that you're looking at a surface of a triangle, if you add the indices clockwise, the side which you're looking on, will be invisible. You can use the right hand rule to remember this.

    • Texture coordinates : after defining the object the system needs to know how cover your object by specified texture.

      The ith entry in the TextureCoordinates list corresponds to the ith entry in the Positions list.

      Example :

      Positions {-1,1,0 -1,-1,0 1,-1,0}

      TriangleIndices {0,1,2}

      TextureCoordinates {0,0 0,1 1,1}

      This means the 0,0 in 2-D space will be mapped to -1,1,0 in 3-D space and so on…

    • Normals : this property isn't always necessary, a normal in WPF is used to know how the surface should be lit by a light source. The normal vector is computed by cross product of two vectors that make up the side of the triangle.

      For example, the normal vector of a triangle which is defined by A, B and C is computed by AB x AC, BC x BA or CB x CA.

  • Texture :

    To define the characteristics of a model's surface, WPF uses the Material abstract class. The concrete subclasses of Material determine some of the appearance characteristics of the model's surface, and each also provides a Brush property to which you can pass a SolidColorBrush, TileBrush, or VisualBrush.

    • DiffuseMaterial : specifies that the brush will be applied to the model as though that model were lit diffusely. Using DiffuseMaterial most resembles using brushes directly on 2-D models; model surfaces do not reflect light as though shiny.
    • SpecularMaterial : specifies that the brush will be applied to the model as though the model's surface were hard or shiny, capable of reflecting highlights. You can set the degree to which the texture will suggest this reflective quality, or "shine," by specifying a value for the SpecularPower property.
    • EmissiveMaterial : allows you to specify that the texture will be applied as though the model were emitting light equal to the color of the brush. This does not make the model a light; however, it will participate differently in shadowing than it would if textured with DiffuseMaterial or SpecularMaterial.
  • Lighting :

    Lights in 3-D graphics do what lights do in the real world: they make surfaces visible. More to the point, lights determine what part of a scene will be included in the projection. Light objects in WPF create a variety of light and shadow effects and are modeled after the behavior of various real-world lights. You must include at least one light in your scene, or no models will be visible.

    The following lights derive from the base class Light:

    • AmbientLight : Provides ambient lighting that illuminates all objects uniformly regardless of their location or orientation.
    • DirectionalLight : Illuminates like a distant light source. Directional lights have a Direction specified as a Vector3D, but no specified location.
    • PointLightIlluminates : like a nearby light source. PointLights have a position and cast light from that position. Objects in the scene are illuminated depending on their position and distance with respect to the light. PointLightBase exposes a Range property, which determines a distance beyond which models will not be illuminated by the light. PointLight also exposes attenuation properties which determine how the light's intensity diminishes over distance. You can specify constant, linear, or quadratic interpolations for the light's attenuation.
    • SpotLightInherits : from PointLight. Spotlights illuminate like PointLight and have both position and direction. They project light in a cone-shaped area set by InnerConeAngle and OuterConeAngle properties, specified in degrees.

    Reference : http://msdn.microsoft.com/en-us/library/ms747437.aspx

    Coming Up : Part 2 – The Application

     

2 Comments

Comments have been disabled for this content.