Question

My app as it initiates it populates a DataGrid with data retrieved from a Data Base. My fields are: Name, ID and Status. The first two no problem, but the third one (Status) is an int, either 1 or 0, indicating active or inactive.

I decided to create an User Control to show the “Status” field. It’s nothing more than a circle wich turns green or red depending on the value of “Status”. The default color of the control is red.

I also created a list object(“data”) that contains my information plus the control with it’s respective color. So far no problem. Everything works, and if I do a quick watch on my data object, everything is as it should be.

My problem is that after I populate the DataGrid with “myDataGrid.ItemsSource = data”, every control “Status” appears as red, when some of them should be green. If I breakpoint at any given time and quick watch my “data” object, everything is fine, but the DataGrid does not update.
The same happens for sorting. If I change the color of any of the controls, after sorting any of the columns, it resets the color of all my user controls to it’s default (red).

After a few tests and research I think that the problem is that the DataGrid updates itself at the end of the item source and instanciates new User Controls instead of using the ones on my data object.

Is there anyway to solve this? I’ve tried a few solutions that I’ve found around the web and nothing worked so far!

Answer 1

Lets assume your class looks something like this…

 public class MyObject
 {
     public string Name { get; set; }
     public int ID { get; set; }
     public int Status { get; set; }
     public UserControl StatusControl { get; }
 }

Is my assumptions correct?

If so, I have a few recommendations

1. Implement INotifyPropertyChanged event and raise property chnaged notifications for Name, ID and Status properties.
2. Get rid of your UserControl type (i.e. StatusControl) property from your model (i.e. MyObject class)

3. Do not use AutogenerateColumns as true (which is by default true) on the datagrid. Create your specific columns…

    <tk:DataGrid x:Name="MyDataGrid"
                 ItemsSource="{Binding MyObjects}"
                 AutoGenerateColumns="False">
         <tk:DataGrid.Columns>
             <tk:DataGridTextColumn Header="ID"
                                    Binding="{Binding ID}" />
             <tk:DataGridTextColumn Header="Name"
                                    Binding="{Binding Name}" />
             <tk:DataGridTemplateColumn Header="Status"
                                        SortMemberPath="Status">
                 <tk:DataGridTemplateColumn.CellTemplate>
                   <DataTemplate>
                       <ns:StatusControl>
                           <ns:StatusControl.Style>
                               <Style TargetType="{x:Type ns:StatusControl}">
                                   <Setter Property="IndicatorColor"
                                           Value="Green"/>
                                   <Style.Triggers>
                                       <DataTrigger Binding="{Binding Status}"
                                                    Value="1">
                                           <Setter Property="IndicatorColor"
                                                   Value="Red"/>
                                       </DataTrigger>
                                   </Style.Triggers>
                               </Style>                                           
                           </myNamespace:StatusControl.Style>
                       </myNamespace:StatusControl>
                   </DataTemplate>
               </tk:DataGridTemplateColumn.CellTemplate>
           </tk:DataGridTemplateColumn>
       </tk:DataGrid.Columns>
    <tk:DataGrid>
   

Here your user control (like the StatusControl) should expose a Brush property (something like IndicatorColor) so that based on the Status, the Fill color of the Circle in the user control (see the DataTrigger) will change.

So this way as you receive updates on Status property of MyObject the DataTrigger will update the color on the user control.

Hope this helps…