How to Change Cell Background Color in Wpf Datagrid

How to change background color for some cell in WPF DataGrid?

it is possible to apply special style to a single auto-generated column.

declare two cell styles in resources

<Window.Resources>
    <Style TargetType="DataGridCell" x:Key="CommonCell"
           BasedOn="{StaticResource {x:Type DataGridCell}}">
        <Setter Property="TextBlock.TextAlignment" Value="Center"/>
    </Style>

    <Style TargetType="DataGridCell" x:Key="ColorPickerCell" 
           BasedOn="{StaticResource CommonCell}">
        <Setter Property="Background" Value="{Binding Path=ColorBackground}"/>
    </Style>
</Window.Resources>

ColorPickerCell inherits CommonCell style.

<DataGrid SelectionUnit="Cell" 
          x:Name="DgDataTable" 
          AutoGenerateColumns="true" HeadersVisibility="All" RowHeaderWidth="20" 
          GridLinesVisibility="Horizontal" 
          ColumnHeaderHeight="10" 
          AlternatingRowBackground="{DynamicResource {x:Static SystemColors.GradientActiveCaptionBrushKey}}" 

          CellStyle="{StaticResource CommonCell}"
          AutoGeneratingColumn="DgDataTable_AutoGeneratingColumn">

    <DataGrid.RowHeaderStyle>
        <Style TargetType="DataGridRowHeader">
            <Setter Property="FontSize" Value="10"/>
            <Setter Property="Background" Value="LightCyan"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
        </Style>
    </DataGrid.RowHeaderStyle>

</DataGrid>

change CellStyle for a generated column:

private void DgDataTable_AutoGeneratingColumn(object sender, DataGridAutoGeneratingColumnEventArgs e)
{
    if (e.PropertyName == "ColorBackground")
    {
        e.Column.CellStyle = (sender as DataGrid).FindResource("ColorPickerCell") as Style;
    }
}

How is it possible to change datagrid cell background color when is selected and focused?

You have to create and set an EditingElementStyle for your data grid column, because you are in edit-mode when you double click a cell. In that mode, the data grid cell contains specific controls for editing, like a TextBox for text columns, so changing the cell background will not have an effect.

The editing style below sets the Background and Foreground of the TextBox in edit-mode.

<DataGrid AutoGenerateColumns="False" ItemsSource="{Binding DataGridRows}" ...>
   <DataGrid.Resources>
      <!-- ...other data grid resources. -->
      <Style x:Key="DataGridTextColumnEditingStyle" 
             TargetType="{x:Type TextBox}"
             BasedOn="{StaticResource {x:Type TextBox}}">
         <Setter Property="Background" Value="#FF333333"/>
         <Setter Property="Foreground" Value="White"/>
      </Style>
   </DataGrid.Resources>
   <!-- ...other data grid code. -->
   <DataGrid.Columns>
      <!-- ...other data grid columns -->
      <DataGridTextColumn Header="CSV Column"
                          IsReadOnly="False"
                          Binding="{Binding Path=CSVColumnValue}"
                          Width="*"
                          Foreground="White"
                          EditingElementStyle="{StaticResource DataGridTextColumnEditingStyle}"/>
   </DataGrid.Columns>
</DataGrid>

WPF Change datagrid cell background color using a converter

1. Return a Brush:

   if (date1.Date > date2.Date)
   {
       return System.Windows.Media.Brushes.Brown;
   }
   

2. Return System.Windows.Data.Binding.DoNothing.

Change Background Color of Disabled Cell in DataGrid WPF

You can put the triggers inside the ControlTemplate. Then whatever property you're referring to in the trigger, in this case "IsEnabled" or "IsSelected", it will point to the property of whatever TargetType it is (in this case DataGridCell), assuming there is such a property for that data type it will work. Otherwise the binding will just break.

 <Setter Property="Template">
        <Setter.Value>
               <ControlTemplate TargetType="{x:Type DataGridCell}">
                  <Grid Background="{TemplateBinding Background}">
                    <ContentPresenter VerticalAlignment="Center" />
                   </Grid>
               <ControlTemplate.Triggers>
                <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Background" Value="LightBlue" />
                        <Setter Property="Foreground" Value="Black" />
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Background" Value="Pink" />
                        <Setter Property="Foreground" Value="Blue" />
                    </Trigger>
              </ControlTemplate.Triggers>
          </ControlTemplate> 
       </Setter.Value>
    </Setter>

---

Related Topics