ansaurus

Question

XAML image source set dynamically based on content

Answer 1

+1 A:

You're right: The easy way to solve this is to use a converter.

The Source property takes an ImageSource, so you'll need to load the bitmap yourself in your converter.

The converter is used like this:

 <Image Source="{Binding Name,
                         RelativeSource={RelativeSource TemplatedParent},
                         Converter={x:Static local:ImageSourceLoader.Instance},
                         ConverterParameter=..\Images\Icons\32x32\Blue\{0}.png}" />

And implemented like this:

public class ImageSourceLoader : IValueConverter
{
  public static ImageSourceLoader Instance = new ImageSourceLoader();

  public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
  {
    var path = string.Format((string)parameter, value.ToString());
    return BitmapFrame.Create(new Uri(path, UriKind.RelativeOrAbsolute));
  }

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

Note that this simple solution can't handle relative Uris because the BaseUri property of the Image is unavailable to the converter. If you want to use relative Uris, you can do this by binding an attached property and using StringFormat:

 <Image local:ImageHelper.SourcePath="{Binding Name,
                         RelativeSource={RelativeSource TemplatedParent},
                         StringFormat=..\Images\Icons\32x32\Blue\{0}.png}" />

And the attached property's PropertyChangedCallback handles loads the image after combining the BaseUri with the formatted Uri string:

public class ImageHelper : DependencyObject
{
  public static string GetSourcePath(DependencyObject obj) { return (string)obj.GetValue(SourcePathProperty); }
  public static void SetSourcePath(DependencyObject obj, string value) { obj.SetValue(SourcePathProperty, value); }
  public static readonly DependencyProperty SourcePathProperty = DependencyProperty.RegisterAttached("SourcePath", typeof(string), typeof(ImageHelper), new PropertyMetadata
  {
    PropertyChangedCallback = (obj, e) =>
      {
        ((Image)obj).Source =
          BitmapFrame.Create(new Uri(((IUriContext)obj).BaseUri, (string)e.NewValue));
      }
  });
}

Ray Burns 2010-06-30 03:57:03

OK trying to get this to work but having problem with string literals and markup extensions because of the Path and {0}

Ingó Vals 2010-06-30 09:51:17

OK works like a charm, had to change one property because of literals like this StringFormat={}..\\Images\\Icons\\32x32\\Green\\{0}.png}"

Ingó Vals 2010-06-30 10:34:36

ansaurus

tags:

views:

answers:

XAML image source set dynamically based on content

related questions