How could I make this display for listbox?

Question

Hello everyone,

I have a databound listbox which is actually displaying two columns of data. It is displayed as follows:

<UserControl.Resources>
        <DataTemplate x:Key="AlignedPairs">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="10" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <TextBlock Text="{Binding Fruits}" Grid.Column="0" />
                <TextBlock Text="->" TextAlignment="Center" Grid.Column="1" />
                <TextBlock Text="{Binding Colors}" Grid.Column="3" />
            </Grid>
        </DataTemplate>
    </UserControl.Resources>

            <ListBox Name="lbStuff" Grid.ColumnSpan="2"  Grid.Row="1"
                     ItemTemplate="{StaticResource AlignedPairs}">
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    </Style>
                </ListBox.ItemContainerStyle>
            </ListBox>

Then Itemsource set in codebehind.

Based on some logic however, I would like to set either a line or a item in one of the columns, e.g. a fruit to red, or the line to bold. I have code to work out which Fruit or Color I would like to differentiate (by color/bold) in the code behind, but I can't figure out, especially given the custom listbox display, how I could go about setting a particular item to a different color/bold.

Does anyone have any ideas?

Let me know if any further code is required. Cheers.

edit: all I really want to be able to do is make the problem as easy as possible... loop through each item in the listbox and check with a string, if there is a match SOMEHOW visually distinguish this item in the listbox/listview. There is no need to make this any more complicated than it needs to be. Why you are not able to individually set an items foreground color is beyond me!

edit 2:

It looks like I almost get there with the following (but it throws exception and doesn't work)

            foreach (var li in ListView.Items)
            {

                if (someCriteria == true) 
                {
                      ((ListViewItem) li).Foreground = Brushes.Red; 
//exception throw as this is the actual object stored in this location (the Fruit object for example) not the row or listviewitem I want to change the color of so it can't be cast :(
                }
            }

Answer 1

DataTriggers will take care of this. Here's a good primer: http://en.csharp-online.net/WPF_Styles_and_Control_Templates%E2%80%94Data_Triggers

Answer 2

This is where the ViewModel design pattern really helps you out.

Presumably you have a class that exposes the properties Fruit and Color. Make a wrapper class that exposes both those properties and also exposes, say, FruitBackgroundBrush and ItemBackgroundBrush. Then you can just bind to those properties in your template, e.g.:

<DataTemplate x:Key="AlignedPairs">
    <Grid Background={Binding ItemBackgroundBrush}>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="10" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <TextBlock Text="{Binding Fruits}" 
                   Background="{Binding FruitBackgroundBrush}" 
                   Grid.Column="0" />
        <TextBlock Text="->" TextAlignment="Center" Grid.Column="1" />
        <TextBlock Text="{Binding Colors}" Grid.Column="3" />
    </Grid>
</DataTemplate>