Changing datagrid cell backcolor with respect to the previous cell value in WPF datagrid

Question

I have created a datagrid in WPF which has cell values continuously changing, But I am not able to change the backcolor of a the cells with respect to the previous value of cell, for Example if the value of the cell changes from 10 to 20 the the color of the cell should become green indicating that the value increased and if the value becomes 5, the cell backcolor should become red indicating that the value has decreased. I have done that in winforms on cellvaluechange event of datagridview, but in WPF I am not able to do the same. any of the professionals have done anything regarding that.

Answer 1

Create a property IsIncreased in your cell's DataContext to hold a Nullable<bool> according to increasing/decreasing.

public class DatagridCellViewModel: INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    protected void FirePropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
    }

    private bool _isIncreased
    public bool? IsIncreased
    {
      get{ return _isIncreased; }
      set{ 
          _isIncreased = value, 
          FirePropertyChanged("IsIncreased");
         }
    }

    //this is going to store the value you have in your table. Don't forget to bind it to the cells content
    private int _dataValue;
    public int DataValue
    {
      get{ return _dataValue; }
      set{
            if(_dataValue != value)
            {
               IsIncreased = _dataValue < value
               _dataValue= value;

               FirePropertyChanged("DataValue");
            }             
         }
    }

    //other properties and methods
}

public class DataGridViewModel
{

     private ICollection<DataGridRowViewModel> _myDgRows = new ObservableCollection<DataGridRowViewModel>();
     public ObservableCollection<DataGridRowViewModel> MyDgRows { get{ return _myDgRows;}
}

public class DataGridRowViewModel : INotifyPropertyChanged // don't forget to implement this interface
{
     //put here fields and properties you want to display in a row in your datagrid
     //that means as many fields as many columns you have

    private DataGridCellViewModel _cellValue;
    public int CellValue
    {
      get{ return _cellValue; }
      set{
            if(!_cellValue.Equals(value))
            {
               _cellValue= value;

               FirePropertyChanged("CellValue");
            }             
         }
    }
}

Create a DataTrigger to set the background of the cell according to the IsIncreased value:

<DataGrid ItemsSource="{Binding MyDgRows}" AutoGenerateColumns="False" >
<DataGrid.Columns>
    <DataGridTemplateColumn Header="ChangingValues" Width="SizeToCells">
        <DataGridTemplateColumn.CellTemplate>
            <DataTemplate>
                <TextBox Name="ContentTbx" Text="{Binding CellValue.DataValue}" />
               <DataTemplate.Triggers>
                  <DataTrigger Binding="{Binding CellValue.IsIncreased}" Value="True">
                     <Setter Property="Background" Value="Green" />
                  </DataTrigger>
                 <DataTrigger Binding="{Binding CellValue.IsIncreased}" Value="False">
                     <Setter TargetName="ContentTbx" Property="Background" Value="Red"/>
                 </DataTrigger>
               </DataTemplate.Triggers>
            </DataTemplate>
        </DataGridTemplateColumn.CellTemplate>
    </DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>

Set the IsIncreased prop every time when the cells Data prop changed

EDIT : Don't bind table but an ObservableCollecition calls MyDgRows. For this a DataGridViewModel instance should be your DataGrids DataContext.

Probably you need to deal with int-string conversion in the DataValue prop.

For that matter I googled

datagrid wpf

the first link was this

and

datatriggers datatemplate

the second result was this

and they covers almost the whole issue. Be more self-sufficient