WPF DataGrid Header Text Background Fill

0
votes

I can't get the Header background filled in DataGrid, as below on screenshot. I've tried stretching the Header and Summary text to fill the the Header space etc. There is a white background above the Summary world (this goes for every Header in the grid). How do I get rid of the white space?

enter image description here

                    <DataGrid x:Name="DisplayGrid" Grid.Row="2" IsReadOnly="False" SelectionMode="Single"  SelectionUnit="Cell" CanUserAddRows="False" CanUserDeleteRows="False" CanUserSortColumns="False" ScrollViewer.VerticalScrollBarVisibility="Visible"
                      AutoGenerateColumns="False" HorizontalAlignment="Stretch" VerticalAlignment="Top" >

                    <DataGrid.ColumnHeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="HorizontalContentAlignment" Value="Center" />
                            <Setter Property="VerticalContentAlignment" Value="Stretch" />
                            <Setter Property="TextBlock.FontWeight" Value="Bold" />
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
                                    <DataTemplate>
                                        <TextBlock TextWrapping="Wrap" Text="{Binding Mode=OneWay}" ></TextBlock>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </DataGrid.ColumnHeaderStyle>

and the Summary column:

                            <DataGridTemplateColumn x:Name="SummaryTextBox" Header="Summary" IsReadOnly="True" MinWidth="100" Width="*" MaxWidth="450">
                            <DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock 
                                        Text="{Binding Summary}" 
                                        TextWrapping="Wrap"
                                        TextAlignment="Justify"
                                        VerticalAlignment="Stretch"
                                        />
                                </DataTemplate>
                            </DataGridTemplateColumn.CellTemplate>
                        </DataGridTemplateColumn>

Edit 1: Adding Background removes the Grid lines from the header. It doesn't look good after that (using different background colors as well).

<Setter Property="Background" Value="Gray"></Setter>

enter image description here

2
c#wpfdatagrid

2 Answers

0
votes
        <DataGrid.ColumnHeaderStyle>
            <Style TargetType="DataGridColumnHeader">
                <Setter Property="HorizontalContentAlignment" Value="Center" />
                <Setter Property="VerticalContentAlignment" Value="Stretch" />
                <Setter Property="TextBlock.FontWeight" Value="Bold" />
                <Setter Property="Background" Value="Gray"></Setter>
                <Setter Property="ContentTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <TextBlock TextWrapping="Wrap" Text="{Binding Mode=OneWay}" ></TextBlock>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </DataGrid.ColumnHeaderStyle>
0
votes

Yes,

The white color is because of default style of column headers so, you have to set the Background explicitly in your style.

<Setter Property="Background" Value="LightGray"/>

You may use gradient colors or shadow effects if you want to have a different look than data part.