How do I change the visual style of a listitem based on its bound value?

Question

I have a listbox (here's the xaml):

            <ListBox MinWidth="300" ItemsSource="{Binding Relationships, Mode=OneWay}" 
        SelectedItem="{Binding SelectedRelationship, Mode=TwoWay}" SelectionMode="Single" 
        HorizontalAlignment="Left" >
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>
                        <CheckBox IsChecked = "{Binding IsPrimary}" IsHitTestVisible="False" />
                        <StackPanel Orientation="Horizontal" Grid.Column="1">
                            <TextBlock Text="{Binding RelationshipType}"  FontWeight="Bold"  Margin="0,0,5,0" />
                            <TextBlock Text="{Binding Status}"  FontStyle="Italic" />                           
                        </StackPanel>
                        <TextBlock Text="{Binding UnitName}" Grid.Row="1" Grid.Column="1" />
                        <TextBlock Text="{Binding StartDate, Converter={StaticResource DateConverter}}" Grid.Row="2" Grid.Column="1"/>
                        <TextBlock Text="{Binding RetireDate}" Grid.Row="3" Grid.Column="1" />
                        <TextBlock Text="{Binding EndDate}" Grid.Row="4" Grid.Column="1" />
                        <TextBlock Text="{Binding ReasonForLeaving}" Grid.Row="5" Grid.Column="1" />
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

What I want to do is have each item in the listbox have one of 3 backgrounds (green if the value of IsPrimary = true, Orange if the EndDate value is empty and grey if the EndDate value is not empty.

Is there a way to template the listbox items so that they evaluate bound items to determine a view state or to have each listbox item bind to a value that I can set for each item in my viewmodel?

Thanks for your help.

Answer 1

I think you need to bind the background of the item's Grid to the value of the DataContext, and pass it through a converter to implement your logic. Something like

<Grid Background="{Binding Converter={StaticResource myItemConverter}}">
   ...
</Grid>

where the converter will look like

public class MyItemConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        var item = value as ItemModel; // [Your ListboxItem Class];
        if (item.IsPrimary)
            return System.Windows.Media.Brushes.Green;
        return item.EndDate.HasValue ? 
            System.Windows.Media.Brushes.Gray : 
            System.Windows.Media.Brushes.Orange;
    }
}