WPF DataGrid RowDetailsTemplate change the background color (Not rows or columns)

Question

I have a RowDetailsTemplate which binds and works well.

But now I want to style in the background of the second DataGrid to show to the user that they are in the next band more clearly.

So I am looking for something like

   <DataGrid.RowDetailsTemplate>
        <DataTemplate>
             <Style TargetType="{x:Type DataGridRow}"...
              ...

However, looking around I can only see DataGridRow, columns etc, but looking to style the surrounding area of this grid, is this possible to style?

Cheers

Answer 1

If you want to change background of RowDetails do something like:

    <Window.Resources> 
    <DataTemplate x:Key="RowButtons">
                <Grid Background="Aqua">
                   ...
                </Grid>
            </DataTemplate>
    </Window.Resources> 

...

<DataGrid SelectionMode="Single"  ItemsSource="{Binding CrawlsCollection}"  RowDetailsTemplate="{StaticResource RowButtons}">...</DataGrid>
...

Answer 2

Just checked back and i have a nested grid but have used a colored header bar to better distinguish between parent and nested grid.

or you could maybe do it through code? detect when a row has row details then set it background. e.Row.Foreground = New SolidColorBrush With {.Color = Colors.Black}

Answer 3

If you put your template inside a container and set that container background, that will fill the area behind your template controls. Note the use of padding to provide space for the background to show around the controls.

        <DataGrid.RowDetailsTemplate>
            <DataTemplate>
                <Border Background="DarkGray" Padding="20,4,4,4">
                <DataGrid ItemsSource="{Binding MyDetailsList}" AutoGenerateColumns="False"  Background="Transparent">
                    <DataGrid.Columns>
                        <DataGridTextColumn Header="Col 1" Binding="{Binding Field1}" />
                        <DataGridTextColumn Header="Col 2" Binding="{Binding Field2, StringFormat=0.000}"  />
                        <DataGridTextColumn Header="Col 3" /> 
                        <DataGridTextColumn Header="Col 4" Binding="{Binding Field3}" />
                    </DataGrid.Columns>
                </DataGrid>
                </Border>
            </DataTemplate>
        </DataGrid.RowDetailsTemplate>