Binding properties to CustomDataTemplate

Question

I have a list of items

public List<Item> MyItems { get; set; }

displayed on the DataGrid. One column shows status "icon" which is defined by template. Code looks something like that:

Column template [...]

<DataGridTemplateColumn Header="Status">
  <DataGridTemplateColumn.CellTemplate>
    <DataTemplate>
      <Grid Height="18" Width="35">
        <Rectangle Fill="{Binding Status.Background}" />
        <TextBlock Text="{Binding Status.Text}" />
      </Grid>   
    </DataTemplate>
  </DataGridTemplateColumn.CellTemplate>    
</DataGridTemplateColumn>

Data model [...]

public class Item
{
    public int ItemId { get; set; }
    public string Name { get; set; }
    public int StatusId { get; set; } 
    public Status Status { get; set; }
}
public class Status
{
    public int StatusId { get; set; }
    public int Text { get; set; }

    public Brush Background
    {
      get
      {
         //Colour logic goes here
      }
    }
}

I'd like to remove colour logic from the data model and put it to the resource file instead.

<DataGridTemplateColumn Header="Status" CellTemplate="{StaticResource MyCustomTemplate}" </DataGridTemplateColumn>

I hope so far I am going to right direction but at this point I am lost as I don't know how to bind Status property (or StatusId) to MyCustomTemplate.

If anyone could help my with this it would be great.

EDIT

This works fine.

<DataGridTemplateColumn Header="V" Width="25" IsReadOnly="True" >
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <ic:CloseIcon  Visibility="{Binding DockStatus, Converter={StaticResource CloseIconDisplayVisibilityConverter}}" />
                <ic:DockIcon Visibility="{Binding DockStatus, Converter={StaticResource DockIconDisplayVisibilityConverter}}" />
                <ic:UndockIcon Visibility="{Binding DockStatus, Converter={StaticResource UndockIconDisplayVisibilityConverter}}" />
            </StackPanel>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

This doesn't refresh UI when model changes (DockStatus changes)

<DataGridTemplateColumn Header="V" Width="25" IsReadOnly="True" CellEditingTemplateSelector="{StaticResource DockIconCellTemplateSelector}}">

score 1 · Answer 1 · answered Jul 23 '12 at 11:29

If it's only about selecting the proper background colour for a specific item, or items with a specific StatusId, you could write a binding converter. The converter would simply convert an int to a Brush:

[ValueConversion(typeof(int), typeof(Brush))]
public class StatusColorConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is int)
        {
            int statusId = (int)value;
            // create Brush from id here and return it
        }

        return null;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

You would modify your Binding like this:

<Rectangle Fill="{Binding Status.StatusId, Converter={StaticResource StatusColorConverter}}" />

Thanks for advice. My problem is more complex and this was just an example. What I am really trying to do is to use a different template depends on model data bind to my column. Instead of CellTemplate I tried to use CellTemplateSelector (See the edit part) and but it doesn't refresh UI as it doesn't support INotifyPropertyChanged. — Novitzky, Jul 25 '12 at 19:15

Binding properties to CustomDataTemplate

1 Answers1