DataGrid to conditionally change rows background color

DataGrid to conditionally change rows background color

Posted by: abellisomi on 15 April 2020, 11:05 am EST

• 

  abellisomi

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 15 April 2020, 11:05 am EST

  Hello, I am following this example to have the rows changing color depending on a property of the row model.

  https://www.grapecity.com/forums/silverlight-edition/c1datagrid-change-row-colo

  This works fine but it comes with a couple of limitations:

  1. I have to define a new brush also for the rows that do not match the condition, I would like them to just follow the default
  2. I lose the alternate row color implementation

  Is any workaround available? Thanks

• 

  basant.khatiyan

  

  • Post Options:
  • Link
    Copy

  Posted 17 April 2020, 2:41 am EST

  Hi,

  In order to achieve this, you can create a style for DataGridRowPresenter as follows:

  <local:Converter x:Key="BackgroundConverter"></local:Converter>
  
  <Style x:Key="RowStyle" TargetType="c1:DataGridRowPresenter">
        <Setter Property="Background" Value="{Binding Path=Row.DataItem, RelativeSource={RelativeSource Self}, Converter={StaticResource BackgroundConverter}}"></Setter>
  </Style>
  
  c1:C1DataGrid x:Name="dataGrid" RowStyle="{StaticResource RowStyle}"></c1:C1DataGrid>
  
  

  Where converter will be as follows:

  public class Converter : IValueConverter
      {
          public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
          {
              if (value != null)
              {
                  if ((value as DataModel).Category == "Old")
                  {
                      return Brushes.Green;
                  }
                  else
                  {
                      return null;
                  }
              }
              return null;
          }
  ...      
      }
  

  Returning ‘null’ will let the DataGrid to provide background (alternative) for rows we didn’t want to have any specific background color.

  Also, another approach could be to handle the LoadedRowPresenter & UnloadedRowPresenter event to change Row Background.

  Please refer the same from the sample attached below.

  Regards,
  
  Basant

  DataGridRowBackgound.zip

• 

  abellisomi

  • Post Options:
  • Link
    Copy

  Posted 17 April 2020, 9:23 am EST

  Thank you that put me in the right path.
  
  I ended up applying a multi binding converter that provides the color definitions and DataGridRow itself to check the Index to alternate the colors

  
  <SolidColorBrush x:Key="Color1" Color="Green" Opacity="0.4" />
  <SolidColorBrush x:Key="Color2" Color="Green" Opacity="0.3" />
  
  <Style x:Key="RowStyle" TargetType="c1:DataGridRowPresenter">
      <Setter Property="Background">
          <Setter.Value>
              <MultiBinding Converter="{StaticResource RowStyleConverter}">
                  <Binding RelativeSource="{RelativeSource Self}" Path="Row"/>
                  <Binding Source="{StaticResource Color1}"/>
                  <Binding Source="{StaticResource Color2}"/>
              </MultiBinding>
          </Setter.Value>
      </Setter>
  </Style>
  
  

  This is in the converter:

  
  public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
  {
      if (values == null || values.Any(each => each == DependencyProperty.UnsetValue))
          return null;
  
      if (values[0] != null && values[0] is DataGridRow presenter)
          if (presenter.DataItem is MyRowModel p)
          {
              if (p.MyColumn != null)
                  return presenter.Index % 2 == 0 ? (SolidColorBrush)values[1] : (SolidColorBrush)values[2];
              
              return null;
          }
  
      return null;
  }
  
  

  Thanks a lot for your assistence

• 

  basant.khatiyan

  

  • Post Options:
  • Link
    Copy

  Posted 20 April 2020, 12:54 am EST

  Thanks for your acknowledgement. I’m glad to know that we could help you out!

  ~Basant