WP7: Rendering Content to a Bitmap

Sometimes you need to render UI content, such as text, to a background bitmap. This can be handy for animation or saving on render time for static content. In Silverlight for Windows Phone 7, this is as easy as creating a WriteableBitmap.

First we’ll create some XAML to show the result:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
  <Image x:Name="theImage" Stretch="Uniform"/>
</Grid>

Then we’ll create the bitmap and assign it to our Image element:

TextBlock tb = new TextBlock();
tb.Text = "My TextBlock";
tb.FontSize = 12;
tb.Foreground = new SolidColorBrush(Colors.Red);
tb.Margin = new Thickness(10);

WriteableBitmap bmp = new WriteableBitmap(tb, null);

this.theImage.Source = bmp;

You should now see the rendered bitmap of the TextBlock on your page when you run your app.