#241 – Rendering Text Using DrawText

You can render text into a visual using the DrawText method of a DrawingContextDrawText renders text that is represented by an instance of FormattedText into the drawing context at a specified location.

Below is an example of drawing some text into a custom DrawingVisual.

    class MyDrawingVisual : DrawingVisual
    {
        public MyDrawingVisual()
        {
            using (DrawingContext dc = RenderOpen())
            {
                // Create formatted text--in a particular font at a particular size
                FormattedText ft = new FormattedText(
                    "When things are at their worst I find something always happens.",
                    CultureInfo.CurrentCulture,
                    FlowDirection.LeftToRight,
                    new Typeface(new FontFamily("Century"), FontStyles.Normal, FontWeights.Bold, FontStretches.Normal),
                    24,    // 36 pt type
                    Brushes.Black);

                // Draw the text at a location
                dc.DrawText(ft, new Point(10.0, 10.0));
            }
        }
    }

Once we host this DrawingVisual in an UIElement, we can see the text in a window:

#236 – Drawing an Arbitrary Geometry into a DrawingVisual

You can render content in a DrawingVisual object by using a DrawingContext to draw objects that you want rendered.  Use the DrawingContext‘s DrawGeometry method to draw an arbitrary geometry.

Below is an example of using DrawGeometry, where we render our object in the DrawingVisual constructor.

        public MyDrawingVisual()
        {
            // First define the geometric shape
            StreamGeometry geom = new StreamGeometry();
            using (StreamGeometryContext gc = geom.Open())
            {
                // Start new object, filled=true, closed=true
                gc.BeginFigure(new Point(150.0, 150.0), true, true);

                // isStroked=true, isSmoothJoin=true
                gc.LineTo(new Point(210.0, 105.0), true, true);
                gc.LineTo(new Point(270.0, 150.0), true, true);
                gc.LineTo(new Point(270.0, 45.0), true, true);
                gc.LineTo(new Point(210.0, 90.0), true, true);
                gc.LineTo(new Point(150.0, 45.0), true, true);
            }

            using (DrawingContext dc = RenderOpen())
            {
                // Draw our geometry
                dc.DrawGeometry(Brushes.DarkRed, new Pen(Brushes.Blue, 2), geom);
            }
        }

We create a new StreamGeometry object, which is what we’ll render into the DrawingContext using the DrawGeometry method.  To create the actual object, we use the StreamGeometryContext of the StreamGeometry and call methods like BeginFigure and LineTo.

#235 – Types of Visual Content that You Can Create Using a DrawingContext

You can render content in a DrawingVisual object by calling its RenderOpen method, which returns a DrawingContext, and then drawing objects by invoking methods on the DrawingContext.

Here are the main DrawingContext methods that you can use to create content in the DrawingVisual:

  • DrawEllipse – Draw an ellipse, specifying the center and radius
  • DrawGeometry – Draw an arbitrary geometry, passing in an instance of Geometry
  • DrawGlyphRun – Render text, passing in an instance of GlyphRun
  • DrawImage – Render an image
  • DrawLine – Draw a line, specifying the endpoints
  • DrawRectangle – Draw a rectangle, specifying the corners
  • DrawRoundedRectangle – Draw a rectangle with rounded corners
  • DrawText – Render text, passing in an instance of FormattedText
  • DrawVideo – Render a video, specifying the media source and corner points of rectangle in which to play the video