Binding to Image source

For the live search sample, I needed to databind Image element to Uri of an image returned by live search. When I databind Image element’s source property to Uri source, it does not work because Data binding does not converter the type Uri into ImageSource. so here is the work around I ended up using. This is just a small sample that I created so that I use this functionality in larger app so it is not fully functional but still proves the point.

I ended up using IValueConverter to convert the Uri into BitmapImage (child of ImageSource). Below is the source code but in short steps are…

Like this:

Related

Post navigation

7 thoughts on “Binding to Image source”

Kirilsays:

Hello Mr. Dalvi,
I have a question concerning binding a MediaElement.
I decided to take your approach for binding an Image and apply it to MediaElement.
This is what my VideoUriConverter class looks like:
object IValueConverter.Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
MediaElement me = new MediaElement();
Uri source = new Uri((string)value, UriKind.RelativeOrAbsolute);
me.Source = source;
return me;
}
Then I bind it the following way
:

When I run the project it produces the following error – [http://img291.imageshack.us/img291/1707/29982351hj7.jpg]
Any idea whether your approach is also applicable for MediaElements ?
Any help would be greatly appreciated.
Kiril

Few things here…
Video elements source property is of type URI so you dont need to use value converters at all. you should be able to just data bind to them

Value converter that you have built actually return media element that means it can be used if you have data that is in URI but some property that is of type of Media element, you could use this value converter to use databinding in that scenario

You are also using Template binding, that should be only used when defining templates for your custom control.