How to: Encode a Visual to an Image File

This example demonstrates how to encode a Visual object into an image file using a RenderTargetBitmap and a PngBitmapEncoder.

Example

The DrawingVisual is created using a BitmapImage and FormattedText which is rendered to a RenderTargetBitmap. The rendered bitmap is then used to create a BitmapFrame which is added to the PngBitmapEncoder to create a new Portable Network Graphics (PNG) file.

// Base Image
BitmapImage bi = new BitmapImage();
bi.BeginInit();
bi.UriSource = new Uri("sampleImages/waterlilies.jpg",UriKind.Relative);
bi.DecodePixelWidth = 200;
bi.EndInit();

// Text to render on the image.
FormattedText text = new FormattedText("Waterlilies",
        new CultureInfo("en-us"),
        FlowDirection.LeftToRight,
        new Typeface(this.FontFamily, FontStyles.Normal, FontWeights.Normal, new FontStretch()),
        this.FontSize,
        Brushes.White);

// The Visual to use as the source of the RenderTargetBitmap.
DrawingVisual drawingVisual = new DrawingVisual();
DrawingContext drawingContext = drawingVisual.RenderOpen();
drawingContext.DrawImage(bi,new Rect(0,0,bi.Width,bi.Height)); 
drawingContext.DrawText(text, new Point(bi.Height/2, 0));
drawingContext.Close();

// The BitmapSource that is rendered with a Visual.
RenderTargetBitmap rtb = new RenderTargetBitmap(bi.PixelWidth, bi.PixelHeight, 96, 96, PixelFormats.Pbgra32);
rtb.Render(drawingVisual);

// Encoding the RenderBitmapTarget as a PNG file.
PngBitmapEncoder png = new PngBitmapEncoder();
png.Frames.Add(BitmapFrame.Create(rtb));
using (Stream stm = File.Create("new.png"))
{
   png.Save(stm);
}
' Base Image
Dim bi As New BitmapImage()
bi.BeginInit()
bi.UriSource = New Uri("sampleImages/waterlilies.jpg", UriKind.Relative)
bi.DecodePixelWidth = 200
bi.EndInit()

' Text to render on the image.
Dim [text] As New FormattedText("Waterlilies", New CultureInfo("en-us"), System.Windows.FlowDirection.LeftToRight, New Typeface(Me.FontFamily, FontStyles.Normal, FontWeights.Normal, New FontStretch()), Me.FontSize, Brushes.White)

' The Visual to use as the source of the RenderTargetBitmap.
Dim drawingVisual As New DrawingVisual()
Dim drawingContext As DrawingContext = drawingVisual.RenderOpen()
drawingContext.DrawImage(bi, New Rect(0, 0, bi.Width, bi.Height))
drawingContext.DrawText([text], New System.Windows.Point(bi.Height / 2, 0))
drawingContext.Close()

' The BitmapSource that is rendered with a Visual.
Dim rtb As New RenderTargetBitmap(bi.PixelWidth, bi.PixelHeight, 96, 96, PixelFormats.Pbgra32)
rtb.Render(drawingVisual)

' Encoding the RenderBitmapTarget as a PNG file.
Dim png As New PngBitmapEncoder()
png.Frames.Add(BitmapFrame.Create(rtb))
Dim stm As Stream = File.Create("new.png")
Try
    png.Save(stm)
Finally
    stm.Dispose()
End Try

A PngBitmapEncoder was used in this example but any of the derived BitmapEncoder objects could have been used to create the image file.

See Also

DrawingContext
Imaging Overview
Drawing Objects Overview
Using DrawingVisual Objects