.netwpfdata-bindingxaml

Image UriSource and Data Binding

I'm trying to bind a list of custom objects to a WPF Image like this:

<Image>
    <Image.Source>
        <BitmapImage UriSource="{Binding Path=ImagePath}" />
    </Image.Source>
</Image>

But it doesn't work. This is the error I'm getting:

"Property 'UriSource' or property 'StreamSource' must be set."

What am I missing?

Solution

  • WPF has built-in converters for certain types. If you bind the Image's Source property to a string or Uri value, under the hood WPF will use an ImageSourceConverter to convert the value to an ImageSource.

    So

    <Image Source="{Binding ImageSource}"/>

    would work if the ImageSource property was a string representation of a valid URI to an image.

    You can of course roll your own Binding converter:

    public class ImageConverter : IValueConverter
{
    public object Convert(
        object value, Type targetType, object parameter, CultureInfo culture)
    {
        return new BitmapImage(new Uri(value.ToString()));
    }

    public object ConvertBack(
        object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

    and use it like this:

    <Image Source="{Binding ImageSource, Converter={StaticResource ImageConverter}}"/>