Dynamic image source binding in silverlight

Cheng Chen picture Cheng Chen · Nov 18, 2010 · Viewed 13.9k times · Source

I want to set an image's source according to its DataContext in a ChildWindow. Here is the XAML file:

<controls:ChildWindow x:Class="CEM.Controls.DialogWindow"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" Title="{Binding Title}">
  ...
  <Image x:Name="DialogIcon"></Image>
  ...
</controls:ChildWindow>

It's working fine if I override the Show method of the ChildWindow and set the image's source:

public new void Show()
{
    DialogIcon.Source = new BitmapImage(new Uri(@"/Images/DialogWindow/Confirm.png", UriKind.Relative));
    base.Show();
}

But it looks ugly and it's not the "silverlight way", so I decide to change:

<Image x:Name="DialogIcon" Source="{Binding DialogIconType, Converter={StaticResource DialogIconConverter}}"></Image>

You see I have a DialogIconConverter registered to bind the source from the DataContext.

public class DialogIconConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
       //currently it's an hard-coded path
       return new BitmapImage(new Uri(@"/Images/DialogWindow/Confirm.png", UriKind.Relative));
    }
    ...
 }

But it's not working now, I have several other converters in this control which are working fine. Only this one is not working. Can you help to find where the problem is?

EDIT: DialogIconType is an enum, and also it's a property of DialogContext. An instance of DialogContext will be assigned to DataContext property of the DialogWindow.

public enum DialogIconType
{ 
    Confirm,
    Alert,
    Error
}
public class DialogContext
{
    public string Title { get; set; }
    public string Content { get; set; }
    public DialogButtons Buttons { get; set; }
    public DialogIconType IconType { get; set; }
}
internal DialogWindow(DialogContext context)
{
    InitializeComponent();
    this.DataContext = context;
}

Answer

Jakob Christensen picture Jakob Christensen · Nov 18, 2010

Assuming that DialogIconType is the path to your image (e.g. "Images/DialogWindow/Confirm.png"), it should work without a valueconverter as shown below:

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

EDIT:

Returning the path to the image from the valueconverter's Convert method is also possible - i.e.:

public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
    return "Images/DialogWindow/Confirm.png";
}

EDIT 2:

The following also works using UriKind.Relative:

public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
    return new BitmapImage(new Uri("Images/DialogWindow/Confirm.png", UriKind.Relative));
}