I want to change background color of Datagrid header in Silverlight.
Although the DataGrid does not expose a Header Background property, it does have a property for the ColumnHeaderStyle. Using the technique that DaniCE has previously suggested for a single column we can replace the header template for all header columns including the empty space on the right hand side. The down side with replacing the entire template for a header is that we lose the sorting arrows and separators which are present in the default header template. Fortunately we can use a template browser to extract the default template being used and then modify a copy of it.
Here I've thrown together a quick example that will change the background of the column headers to LightBlue while keeping the separators and sorting. Take a look at the default DataGridColumnHeader template in a template browser to see how to deal with modifying the Background when the mouse hovers over the ColumnHeader.
<data:DataGrid x:Name="grid">
<data:DataGrid.ColumnHeaderStyle>
<Style
xmlns:primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data"
xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
TargetType="primitives:DataGridColumnHeader" >
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="primitives:DataGridColumnHeader">
<Grid Name="Root">
<vsm:VisualStateManager.VisualStateGroups>
<vsm:VisualStateGroup x:Name="SortStates" >
<vsm:VisualStateGroup.Transitions>
<vsm:VisualTransition GeneratedDuration="00:00:0.1" />
</vsm:VisualStateGroup.Transitions>
<vsm:VisualState x:Name="Unsorted" />
<vsm:VisualState x:Name="SortAscending">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="SortIcon" Storyboard.TargetProperty="Opacity" Duration="0" To="1.0" />
</Storyboard>
</vsm:VisualState>
<vsm:VisualState x:Name="SortDescending">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="SortIcon" Storyboard.TargetProperty="Opacity" Duration="0" To="1.0" />
<DoubleAnimation Storyboard.TargetName="SortIconTransform" Storyboard.TargetProperty="ScaleY" Duration="0" To="-.9" />
</Storyboard>
</vsm:VisualState>
</vsm:VisualStateGroup>
</vsm:VisualStateManager.VisualStateGroups>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Rectangle x:Name="BackgroundRectangle" Stretch="Fill" Fill="LightBlue" Grid.ColumnSpan="2" Grid.RowSpan="2" />
<ContentPresenter Grid.RowSpan="2" Content="{TemplateBinding Content}" Cursor="{TemplateBinding Cursor}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" />
<Rectangle Name="VerticalSeparator" Grid.RowSpan="2" Grid.Column="2" Width="1" VerticalAlignment="Stretch" Fill="{TemplateBinding SeparatorBrush}" Visibility="{TemplateBinding SeparatorVisibility}" />
<Path Grid.RowSpan="2" Name="SortIcon" RenderTransformOrigin=".5,.5" HorizontalAlignment="Left" VerticalAlignment="Center" Opacity="0" Grid.Column="1" Stretch="Uniform" Width="8" Data="F1 M -5.215,6.099L 5.215,6.099L 0,0L -5.215,6.099 Z ">
<Path.Fill>
<SolidColorBrush Color="#FF444444" />
</Path.Fill>
<Path.RenderTransform>
<TransformGroup>
<ScaleTransform x:Name="SortIconTransform" ScaleX=".9" ScaleY=".9" />
</TransformGroup>
</Path.RenderTransform>
</Path>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</data:DataGrid.ColumnHeaderStyle>
</data:DataGrid>
Hope this helps!