Bind rectangle fill to a value

Question

<UserControl.Resources>

 <DataTemplate x:Key="MyCustomTemplate">
            <StackPanel Orientation="Horizontal">
                <Label Content="{Binding Path=ID}"/>
                <Rectangle Height="18" Width="20" />
            </StackPanel>
        </DataTemplate>
    </UserControl.Resources>

<Grid>
<ListBox x:Name="userListBox" Margin="10"/>
</Grid>

Code behind:

userListbox.ItemsSource = myservice.getvalue();

Now how do I bind the rectangle color. The getValue return a list of Objects whose one member is integer and I have to use that value to decide the color of rectangle. Say if object.item = 1 color = green object.item=2 color = red

Answer 1

you can use data trigger to achieve that, example:

<DataTemplate x:Key="MyCustomTemplate">
    <StackPanel Orientation="Horizontal">
        <Label Content="{Binding Path=ID}"/>
        <Rectangle x:Name="rect" Height="18" Width="20" />
    </StackPanel>
    <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding Path=object.item}" Value="1">
            <Setter TargetName="rect" Property="Fill" Value="Green"/>
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=object.item}" Value="2">
            <Setter TargetName="rect" Property="Fill" Value="Red"/>
        </DataTrigger>
    </DataTemplate.Triggers>
</DataTemplate>

and then bind the value for the templated control to selected item of the listbox

  <Label ContentTemplate="{DynamicResource MyCustomTemplate}" Grid.Column="2" Content="{Binding ElementName=userListBox, Path=SelectedItem}"/>

or if the datatemplate is actually for the listbox, then you can do it this way:

<ListBox x:Name="userListBox" Margin="10" ItemTemplate="{DynamicResource MyCustomTemplate}" />

Answer 2

Use ValueConverter, info here: http://blogs.msdn.com/b/bencon/archive/2006/05/10/594886.aspx