This documentation is archived and is not being maintained.

How to: Use a Drawing as an Image Source

This example shows how to use a Drawing as the Source for an Image control. To display a Drawing with an Image control, use a DrawingImage as the Image control's Source and set the DrawingImage object's System.Windows.Media.DrawingImage.Drawing property to the drawing you want to display.


The following example uses a DrawingImage and an Image control to display a GeometryDrawing. This example produces the following output:

A DrawingImage
A GeometryDrawing of two ellipses
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SDKSample
    public class DrawingImageExample : Page

        public DrawingImageExample()

            // Create the Geometry to draw.
            GeometryGroup ellipses = new GeometryGroup();
                new EllipseGeometry(new Point(50,50), 45, 20)
                new EllipseGeometry(new Point(50, 50), 20, 45)

            // Create a GeometryDrawing.
            GeometryDrawing aGeometryDrawing = new GeometryDrawing();
            aGeometryDrawing.Geometry = ellipses;

            // Paint the drawing with a gradient.
            aGeometryDrawing.Brush = 
                new LinearGradientBrush(
                    new Point(0,0), 
                    new Point(1,1));

            // Outline the drawing with a solid color.
            aGeometryDrawing.Pen = new Pen(Brushes.Black, 10);

            // Use a DrawingImage and an Image control
            // to display the drawing.
            DrawingImage geometryImage = new DrawingImage(aGeometryDrawing);

            // Freeze the DrawingImage for performance benefits.

            Image anImage = new Image();
            anImage.Source = geometryImage;
            anImage.HorizontalAlignment = HorizontalAlignment.Left;

            // Place the image inside a border and
            // add it to the page.
            Border exampleBorder = new Border();
            exampleBorder.Child = anImage;
            exampleBorder.BorderBrush = Brushes.Gray;
            exampleBorder.BorderThickness = new Thickness(1);
            exampleBorder.HorizontalAlignment = HorizontalAlignment.Left;
            exampleBorder.VerticalAlignment = VerticalAlignment.Top;
            exampleBorder.Margin = new Thickness(10);

            this.Margin = new Thickness(20);
            this.Background = Brushes.White;
            this.Content = exampleBorder;


  Background="White" Margin="20">

  <Border BorderBrush="Gray" BorderThickness="1" 
    HorizontalAlignment="Left" VerticalAlignment="Top"

    <!-- This image uses a Drawing object for its source. -->
        <DrawingImage PresentationOptions:Freeze="True">
                  <EllipseGeometry Center="50,50" RadiusX="45" RadiusY="20" />
                  <EllipseGeometry Center="50,50" RadiusX="20" RadiusY="45" />
                  <GradientStop Offset="0.0" Color="Blue" />
                  <GradientStop Offset="1.0" Color="#CCCCFF" />
                <Pen Thickness="10" Brush="Black" />


See Also