DataGrid - CheckBox column

I've created a DataGridColumn that looks like the following:

<ms:DataGridColumn Header="My Heading"
                   DisplayMemberBinding="{Binding Path=MyIsCheckedProperty}"
                   Width="100">
  <ms:DataGridColumn.DisplayTemplate>
    <DataTemplate>
      <CheckBox IsChecked="{Binding Path=MyIsCheckedProperty}" />
    </DataTemplate>
  </ms:DataGridColumn.DisplayTemplate>
  <ms:DataGridColumn.EditorTemplate>
    <DataTemplate>
      <CheckBox IsChecked="{Binding Path=MyIsCheckedProperty}" />
    </DataTemplate>
  </ms:DataGridColumn.EditorTemplate>
</ms:DataGridColumn>

I've noticed a paint issue when the mouse enters/exits the cell. There is an annoying flicker of the CheckBox control. Any ideas what might be causing this? Is this the correct approach to add a CheckBox column to the DataGrid? Note: The DisplayMemberBinding is being set to allow for grouping and sorting the column.

Hello Jared

You are taking the correct approach for adding a checkbox column. Here is the reason for the flickering: In the data grid styles, cells have 3 Rectangle elements to display mouse over, selected, highlighted and invalidated states. If all the visible cells in the data grid have all these Rectangles at once, even if they are not visible, they cause the performance of the data grid to drop. To resolve this, we made 2 cell templates, a simple one, and one that includes those 3 rectangles. Only when a cell is in one of those states will it use the heavier template. That means as the mouse moves over the cells, they are switching between 2 different templates. This produces much better performance than having 3 Rectangles in all cells at once. The problem is, switching between these 2 templates cause the controls to be reloaded. In the case of check boxes, this causes the tick mark fading animation to be replayed as the mouse moves over the cell. In our styles this is not noticeable because our CheckBox styles don't have animations.

So overall, to solve this issue you need to use a CheckBox style that doesn't have an animation. There are a few options to do this: You could use our OfficeSilver style on the data grid. This style is very similar to the generic style. This will also style all the controls within the data grid include standard WPF controls. If you don't want to affect the styling of the other controls within the data grid, then you could just apply our OfficeSilver style to only the check box. The other alternative is for you to create your own check box style that looks like the generic check box style but doesn't have a tick mark fading animation.

If you need help with any of these approaches, let me know and I'll help you out.

Jason Fauchelle

Thanks Jason for the detailed explanation. This makes perfect sense. I've resolved the issue by using one of your themes for the CheckBox control. Thank you!