How can I set the color of a selected row in DataGrid

Question

The default background color of a selected row in DataGrid is so dark that I can\'t read it. Is there anyway of overriding it?

Tried this

Answer 1

The above solution left blue border around each cell in my case.

This is the solution that worked for me. It is very simple, just add this to your DataGrid. You can change it from a SolidColorBrush to any other brush such as linear gradient.

<DataGrid.Resources>
  <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" 
                   Color="#FF0000"/>
</DataGrid.Resources>

Answer 2

The default IsSelected trigger changes 3 properties, Background, Foreground & BorderBrush. If you want to change the border as well as the background, just include this in your style trigger.

<Style TargetType="{x:Type dg:DataGridCell}">
    <Style.Triggers>
        <Trigger Property="dg:DataGridCell.IsSelected" Value="True">
            <Setter Property="Background" Value="#CCDAFF" />
            <Setter Property="BorderBrush" Value="Black" />
        </Trigger>
    </Style.Triggers>
</Style>

Answer 3

As an extention to @Seb Kade's answer, you can fully control the colours of the selected and unselected rows using the following Style:

<Style TargetType="{x:Type DataGridRow}">
    <Style.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent" />
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" />
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black" />
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Black" />
    </Style.Resources>
</Style>

You can of course enter whichever colours you prefer. This Style will also work for other collection items such as ListBoxItems (if you replace TargetType="{x:Type DataGridRow}" with TargetType="{x:Type ListBoxItem}" for instance).

Answer 4

I've tried ControlBrushKey but it didn't work for unselected rows. The background for the unselected row was still white. But I've managed to find out that I have to override the rowstyle.

<DataGrid x:Name="pbSelectionDataGrid" Height="201" Margin="10,0"
          FontSize="20" SelectionMode="Single" FontWeight="Bold">
    <DataGrid.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FFFDD47C"/>
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="#FFA6E09C"/>
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Red"/>
        <SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Violet"/>
    </DataGrid.Resources>
    <DataGrid.RowStyle>
        <Style TargetType="DataGridRow">
            <Setter Property="Background" Value="LightBlue" />
        </Style>
    </DataGrid.RowStyle>
</DataGrid>

Answer 5

I had this problem and I nearly tore my hair out, and I wasn't able to find the appropriate answer on the net. I was trying to control the background color of the selected row in a WPF DataGrid. It just wouldn't do it. In my case, the reason was that I also had a CellStyle in my datagrid, and the CellStyle overrode the RowStyle I was setting. Interestingly so, because the CellStyle wasn't even setting the background color, which was instead bing set by the RowBackground and AlternateRowBackground properties. Nevertheless, trying to set the background colour of the selected row did not work at all when I did this:

        <DataGrid ... >
        <DataGrid.RowBackground>
            ...
        </DataGrid.RowBackground>
        <DataGrid.AlternatingRowBackground>
            ...
        </DataGrid.AlternatingRowBackground>
        <DataGrid.RowStyle>
            <Style TargetType="{x:Type DataGridRow}">
                <Style.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Background" Value="Pink"/>
                        <Setter Property="Foreground" Value="White"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </DataGrid.RowStyle>
        <DataGrid.CellStyle>
            <Style TargetType="{x:Type DataGridCell}">
                <Setter Property="Foreground" Value="{Binding MyProperty}" />
            </Style>
        </DataGrid.CellStyle>

and it did work when I moved the desired style for the selected row out of the row style and into the cell style, like so:

    <DataGrid ... >
        <DataGrid.RowBackground>
            ...
        </DataGrid.RowBackground>
        <DataGrid.AlternatingRowBackground>
            ...
        </DataGrid.AlternatingRowBackground>
        <DataGrid.CellStyle>
            <Style TargetType="{x:Type DataGridCell}">
                <Setter Property="Foreground" Value="{Binding MyProperty}" />
                <Style.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Background" Value="Pink"/>
                        <Setter Property="Foreground" Value="White"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </DataGrid.CellStyle>

Just posting this in case someone has the same problem.

Answer 6

I spent the better part of a day fiddling with this problem. Turned out the RowBackground Property on the DataGrid - which I had set - was overriding all attempts to change it in . As soon as I deleted it, everything worked. (Same goes for Foreground set in DataGridTextColumn, by the way).