Silverlight binding image to an integer

I got this problem for a long time now. And still I don't know how to fix it... I'm trying to bind an image to a value in my datagrid.

The field is called Billable and it's 0 or 1. When I have the value 1 I want to show a greenCross. When the value is 0 I want to show a RedCross.

Here is the code

<telerik:RadGridView Grid.Column="1" Grid.Row="0" x:Name="RadGridView1" 
                             ItemsSource="{Binding TypeRegs}" 
                             IsReadOnly="True" 
                             DataContext="{Binding Source={StaticResource TypeRegViewModel}}" 
                             AutoGenerateC开发者_如何转开发olumns="False" 
                             ScrollMode="Deferred"
                             GridLinesVisibility="Horizontal"
                             IsSynchronizedWithCurrentItem="True" 
                             SelectedItem="{Binding Path=SelectedTypeReg, Mode=TwoWay}"
                             SelectionUnit="FullRow">
                <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn Header="Description" DataMemberBinding="{Binding Description}" />
                    <telerik:GridViewDataColumn Header="Billable" DataMemberBinding="{Binding Billable}" />
                </telerik:RadGridView.Columns>
            </telerik:RadGridView>

Does anybody have any idea how to fix it?

Please tell me in steps. I have tried many things... None of them work.

Thx

I just found the answer guys. I will share it ;)

First you need to create a coverter that looks like this.

 public class CommentTypeIconConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value != null)
            {
                int ct = int.Parse(value.ToString());
                if (ct == 1)
                {
                    StreamResourceInfo sr = Application.GetResourceStream(
                        new Uri("/COVR.TimeRegistration;component/Images/true.png", UriKind.Relative));
                    BitmapImage bmp = new BitmapImage();
                    bmp.SetSource(sr.Stream);

                    return bmp;
                }
                else
                {
                    StreamResourceInfo sr = Application.GetResourceStream(
                    new Uri("/COVR.TimeRegistration;component/Images/false.png", UriKind.Relative));
                    BitmapImage bmp = new BitmapImage();
                    bmp.SetSource(sr.Stream);

                    return bmp;
                }
            }
            else
            {
                return MessageBox.Show("Fout");
            }
        }

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

This coverter will return the images

Your xaml will look like this

<telerik:RadGridView Grid.Column="1" Grid.Row="0" x:Name="RadGridView1" 
                         ItemsSource="{Binding TypeRegs}" 
                         IsReadOnly="True" 
                         DataContext="{Binding Source={StaticResource TypeRegViewModel}}" 
                         AutoGenerateColumns="False" 
                         ScrollMode="Deferred"
                         GridLinesVisibility="Horizontal"
                         IsSynchronizedWithCurrentItem="True" 
                         SelectedItem="{Binding Path=SelectedTypeReg, Mode=TwoWay}"
                         SelectionUnit="FullRow">
            <telerik:RadGridView.Columns>
                <telerik:GridViewDataColumn Header="Description" DataMemberBinding="{Binding Description}"/>
                <telerik:GridViewDataColumn Header="Billable" Width="50">
                    <telerik:GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <Image Width="16" Height="16" Source="{Binding Billable,Converter={StaticResource CommentTypeIconConverter}}">
                              </Image>
                        </DataTemplate>
                    </telerik:GridViewColumn.CellTemplate>
                </telerik:GridViewDataColumn>
            </telerik:RadGridView.Columns>
        </telerik:RadGridView>

This works fine!!

If you need any help you can ask :)

First of all why do you want to bind it to gridView column instead of binding it directly to Billable property. Also instead of binding you can use DataTriggers. Here is the code I'm using for the same purpose on WPF, please check if it will help you with Silverlight:

<Image>
    <Image.Style>
        <Style TargetType="Image">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Billable}" Value="0">
                    <Setter Property="Source" Value="RedCross.png" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Billable}" Value="1">
                    <Setter Property="Source" Value="GreenCross.png" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>