Skip to main content Skip to footer

How to Style an Entire Row Conditionally Based on Values in One Column

Use Case: I have a FlexGrid control bound to a DataTable and would like to use XAML to change the background of the whole row based on the value in a specific column.

Solution: You need to set the TargetType of the flexgrid's RowStyle property to "GridControlCellView" and then create a DataTrigger as follows:

<c1:FlexGrid.RowStyle>
      <Style TargetType="c1:GridControlCellView">
            <Style.Triggers>
                  <DataTrigger Binding="{Binding Tag.sysMandatory, RelativeSource={RelativeSource Mode=Self}}" Value="True">
                       <Setter Property="Background" Value="Red" />
                  </DataTrigger>
            </Style.Triggers>
      </Style>
</c1:FlexGrid.RowStyle>

Then you may set the DataContext for the cells by overriding GridCellFactory's BindCellContent method so that you can further fetch it to obtain the DataContext associated with each GridControlCellView. Please refer to the following code:

public class MyCellFactory : GridCellFactory
    {
        public override void BindCellContent(GridCellType cellType, GridCellRange range, FrameworkElement cellContent)
        {
            if (cellType == GridCellType.Cell)
            {
                (cellContent.Parent as GridCellView).Tag = Grid.Rows[range.Row].DataItem;
            }

            base.BindCellContent(cellType, range, cellContent);
        }
    }