Problem with Icon binding in WPF Fluent

Question

I am using Fluent from fluent.codeplex.com.

This works in my XAML file:

<Image Name="image1" Stretch="Fill" Height="40" 
       HorizontalAlignment="Left"         
       VerticalAlignment="Top" Width="40" 
       Source="{StaticResource error_button}" />

and displays the image.

When I try to use it as an icon for fluent button

<Fluent:Button Header="adsfasf">
  <Fluent:Button.Icon>
  <Image Height="40" HorizontalAlignment="Left" VerticalAlignment="Top" Width="40"    
         Source="{StaticResource error_button}" />
  </Fluent:Button.Icon>
</Fluent:Button>

the button has no icon. Am I missing something?

Answer 1

I'm not familiar with the Fluent Ribbon component, but looking through the source code, it uses this to display the button icon:

http://fluent.codeplex.com/SourceControl/changeset/view/57318#527240

<ContentPresenter 
  ...
  Content="{Binding LargeIcon, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource StringToImageConvert}}" />

The StringToImageConvert is defined as:

<Fluent:ObjectToImageConverter x:Key="StringToImageConvert"/>

The implementation of the Convert method in that converter looks like this (via reflector - the Fluent developers need to seperate classes into their own files better).

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
    if (value is string)
    {
        Image image = new Image();
        image.Stretch = Stretch.None;
        image.Source = new BitmapImage(new Uri(value as string, UriKind.RelativeOrAbsolute), new RequestCachePolicy(RequestCacheLevel.NoCacheNoStore));
        return image;
    }
    if (value is ImageSource)
    {
        Image image2 = new Image();
        image2.Stretch = Stretch.None;
        image2.Source = (ImageSource) value;
        return image2;
    }
    return value;
}

So judging from the code, your best bet is to try this:

<Fluent:Button 
    Header="adsfasf" 
    Icon="{StaticResource error_button}" 
    LargeIcon="{StaticResource error_button}" 
    />