In this series final blog entry I’ll show how to enhance Silverlight binding to show image data as shown in a sample application I created that was demonstrated across Canada in Microsoft’s EnergizeIT tour.

As I explained in Part 4 of this series, the data for the image above was downloaded from an ADO.NET Data Services (or an OData service) and displayed in the UI. 

Typically in Silverlight, an Image element has its Source set to the URL of an image and Silverlight takes care of downloading the image.

When the image needs to be dynamically set, you may not have a URL available (either different URLs or one that takes a query string parameter to dynamically return an image) to get the image you want.  Such a URL capability may be worth thinking about in the long run (given suitable security) using something like Windows Azure Storage (and its associated Content Delivery Network). 

What you may have is the bytes for the image returned to you through some data service request.

In that case you’ll need a binding convertor if you still want to use binding.

We create a class based on IValueConvertor which in this case can take the bytes and create the necessary BitmapImage as an acceptable source for the Image element.

We then need to use this in the XAML so we declare our class namespace in the XAML namespace…

then declare a resource instance based on the class, here called “converter”

then when we bind our image to the binary data stream, we use our converter…

 

There are many uses for converters, typically converting between text and structured types, but this conversion between binary data and an image source is often useful and allows us to stay within a binding-based architecture.

This post concludes this series.