Edit

Share via

How to: Apply a Drawing to a 3D Model

  • Article

This example shows how to use a DrawingBrush as the Material applied to a 3D model.

The following code defines a DrawingGroup as the content of a DrawingBrush. The DrawingBrush is set as the Brush property of the DiffuseMaterial applied to a 3D plane.

Note

It is often desirable to define complex objects and values like the drawing below as resources which can be reused and simplify your code. See XAML Resources for more information.

<!-- The material specifies the material applied to the 3D object. In this sample a tiled drawing   
     covers the surface of the 3D object.-->
<GeometryModel3D.Material>
  <DiffuseMaterial>
    <DiffuseMaterial.Brush>
      <DrawingBrush Viewport="0,0,0.1,0.1" TileMode="Tile">
        <DrawingBrush.Drawing>
          <DrawingGroup>
            <DrawingGroup.Children>
              <GeometryDrawing Geometry="M0,0.1 L0.1,0 1,0.9, 0.9,1z"
                Brush="Gray" />
              <GeometryDrawing Geometry="M0.9,0 L1,0.1 0.1,1 0,0.9z"
                Brush="Gray" />
              <GeometryDrawing Geometry="M0.25,0.25 L0.5,0.125 0.75,0.25 0.5,0.5z"
                Brush="#FFFF00" />
              <GeometryDrawing Geometry="M0.25,0.75 L0.5,0.875 0.75,0.75 0.5,0.5z"
                Brush="Black" />
              <GeometryDrawing Geometry="M0.25,0.75 L0.125,0.5 0.25,0.25 0.5,0.5z"
                Brush="#FF0000" />
              <GeometryDrawing Geometry="M0.75,0.25 L0.875,0.5 0.75,0.75 0.5,0.5z"
                Brush="MediumBlue" />
            </DrawingGroup.Children>
          </DrawingGroup>
        </DrawingBrush.Drawing>
      </DrawingBrush>
    </DiffuseMaterial.Brush>
  </DiffuseMaterial>
</GeometryModel3D.Material>

Example

The following code shows the entire sample.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >
  <DockPanel>
    <Viewbox>
      <Canvas Width="321" Height="201">

        <!-- The Viewport3D provides a rendering surface for 3-D visual content. -->
        <Viewport3D ClipToBounds="True" Width="150" Height="150" Canvas.Left="0" Canvas.Top="10">

          <!-- Defines the camera used to view the 3D object. -->
          <Viewport3D.Camera>
            <PerspectiveCamera Position="0,0,2" LookDirection="0,0,-1" FieldOfView="60" />
          </Viewport3D.Camera>

          <!-- The ModelVisual3D children contain the 3D models -->
          <Viewport3D.Children>

            <!-- This ModelVisual3D defines the light cast in the scene. Without light, the 3D 
                 object cannot be seen. Also, the direction of the lights affect shadowing. If desired,
                 you can create multiple lights with different colors that shine from different directions. -->
            <ModelVisual3D>
              <ModelVisual3D.Content>
                <DirectionalLight Color="#FFFFFF" Direction="-0.612372,-0.5,-0.612372" />
              </ModelVisual3D.Content>
            </ModelVisual3D>
            <ModelVisual3D>
              <ModelVisual3D.Content>
                <GeometryModel3D>

                  <!-- The geometry specifies the shape of the 3D plane. In this sample, a flat sheet is created. -->
                  <GeometryModel3D.Geometry>
                    <MeshGeometry3D
                     TriangleIndices="0,1,2 3,4,5 "
                     Normals="0,0,1 0,0,1 0,0,1 0,0,1 0,0,1 0,0,1 "
                     TextureCoordinates="0,0 1,0 1,1 1,1 0,1 0,0 "
                     Positions="-0.5,-0.5,0.5 0.5,-0.5,0.5 0.5,0.5,0.5 0.5,0.5,0.5 -0.5,0.5,0.5 -0.5,-0.5,0.5 " />
                  </GeometryModel3D.Geometry>
                  <!-- The material specifies the material applied to the 3D object. In this sample a tiled drawing   
                       covers the surface of the 3D object.-->
                  <GeometryModel3D.Material>
                    <DiffuseMaterial>
                      <DiffuseMaterial.Brush>
                        <DrawingBrush Viewport="0,0,0.1,0.1" TileMode="Tile">
                          <DrawingBrush.Drawing>
                            <DrawingGroup>
                              <DrawingGroup.Children>
                                <GeometryDrawing Geometry="M0,0.1 L0.1,0 1,0.9, 0.9,1z"
                                  Brush="Gray" />
                                <GeometryDrawing Geometry="M0.9,0 L1,0.1 0.1,1 0,0.9z"
                                  Brush="Gray" />
                                <GeometryDrawing Geometry="M0.25,0.25 L0.5,0.125 0.75,0.25 0.5,0.5z"
                                  Brush="#FFFF00" />
                                <GeometryDrawing Geometry="M0.25,0.75 L0.5,0.875 0.75,0.75 0.5,0.5z"
                                  Brush="Black" />
                                <GeometryDrawing Geometry="M0.25,0.75 L0.125,0.5 0.25,0.25 0.5,0.5z"
                                  Brush="#FF0000" />
                                <GeometryDrawing Geometry="M0.75,0.25 L0.875,0.5 0.75,0.75 0.5,0.5z"
                                  Brush="MediumBlue" />
                              </DrawingGroup.Children>
                            </DrawingGroup>
                          </DrawingBrush.Drawing>
                        </DrawingBrush>
                      </DiffuseMaterial.Brush>
                    </DiffuseMaterial>
                  </GeometryModel3D.Material>
                  <!-- Apply a transform to the object. In this sample, a rotation transform is applied, rendering the 
                       3D object rotated. -->
                  <GeometryModel3D.Transform>
                    <RotateTransform3D>
                      <RotateTransform3D.Rotation>
                        <AxisAngleRotation3D Axis="0,3,0" Angle="40" />
                      </RotateTransform3D.Rotation>
                    </RotateTransform3D>
                  </GeometryModel3D.Transform>
                </GeometryModel3D>
              </ModelVisual3D.Content>
            </ModelVisual3D>
          </Viewport3D.Children>
        </Viewport3D>
      </Canvas>
    </Viewbox>
  </DockPanel>
</Page>

See also