怎样改变DataGrid的列头样式？

Question

SL具有可改变任何元素外观的特性，这个特性深深吸引了我。
但除了一般的TextBox或Button外，ComboBox或DataGrid我却很难找出定制外观的方法。
以下是DataGrid的模板XAML：

<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	x:Class="SilverlightApplication3.Page"
	Width="640" Height="480" xmlns:System_Windows_Controls_Primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" xmlns:SilverlightApplication3="clr-namespace:SilverlightApplication3" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows">
	<UserControl.Resources>
		<Style x:Key="DataGridStyle1" TargetType="data:DataGrid">
			<Setter Property="RowBackground" Value="#AAEAEFF4"/>
			<Setter Property="AlternatingRowBackground" Value="#00FFFFFF"/>
			<Setter Property="Background" Value="#FFFFFFFF"/>
			<Setter Property="HeadersVisibility" Value="Column"/>
			<Setter Property="HorizontalScrollBarVisibility" Value="Auto"/>
			<Setter Property="VerticalScrollBarVisibility" Value="Auto"/>
			<Setter Property="SelectionMode" Value="Extended"/>
			<Setter Property="CanUserReorderColumns" Value="True"/>
			<Setter Property="CanUserResizeColumns" Value="True"/>
			<Setter Property="CanUserSortColumns" Value="True"/>
			<Setter Property="AutoGenerateColumns" Value="True"/>
			<Setter Property="RowDetailsVisibilityMode" Value="VisibleWhenSelected"/>
			<Setter Property="BorderBrush">
				<Setter.Value>
					<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
						<GradientStop Color="#FFA3AEB9" Offset="0"/>
						<GradientStop Color="#FF8399A9" Offset="0.375"/>
						<GradientStop Color="#FF718597" Offset="0.375"/>
						<GradientStop Color="#FF617584" Offset="1"/>
					</LinearGradientBrush>
				</Setter.Value>
			</Setter>
			<Setter Property="BorderThickness" Value="1"/>
			<Setter Property="DragIndicatorStyle">
				<Setter.Value>
					<Style TargetType="ContentControl">
						<Setter Property="FontSize" Value="10.5"/>
						<Setter Property="FontWeight" Value="Bold"/>
						<Setter Property="Foreground" Value="#7FFFFFFF"/>
						<Setter Property="Template">
							<Setter.Value>
								<ControlTemplate TargetType="ContentControl">
									<Grid>
										<Grid.ColumnDefinitions>
											<ColumnDefinition Width="Auto"/>
											<ColumnDefinition Width="*"/>
											<ColumnDefinition Width="Auto"/>
										</Grid.ColumnDefinitions>
										<Grid.RowDefinitions>
											<RowDefinition Height="*"/>
											<RowDefinition Height="*"/>
											<RowDefinition Height="Auto"/>
										</Grid.RowDefinitions>
										<Rectangle x:Name="BackgroundRectangle" Grid.ColumnSpan="2" Grid.RowSpan="2" Fill="#66808080" Stretch="Fill"/>
										<Rectangle x:Name="BackgroundGradient" Opacity="0" Grid.ColumnSpan="2" Grid.RowSpan="2" Stretch="Fill">
											<Rectangle.Fill>
												<LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
													<GradientStop Color="#FFFFFFFF" Offset="0.015"/>
													<GradientStop Color="#F9FFFFFF" Offset="0.375"/>
													<GradientStop Color="#E5FFFFFF" Offset="0.6"/>
													<GradientStop Color="#C6FFFFFF" Offset="1"/>
												</LinearGradientBrush>
											</Rectangle.Fill>
										</Rectangle>
										<ContentPresenter Margin="4,4,5,4" VerticalAlignment="Center"/>
										<Rectangle VerticalAlignment="Stretch" Width="1" Visibility="Visible" Grid.Column="2" Grid.RowSpan="2" Fill="#FFAAAAAA"/>
										<Path HorizontalAlignment="Left" x:Name="SortIcon" VerticalAlignment="Center" Width="8" Opacity="0" RenderTransformOrigin=".5,.5" Grid.Column="1" Fill="#7FFFFFFF" Stretch="Uniform" Data="F1 M -5.215,0.0L 5.215,0.0L 0,6.099L -5.215,0.0 Z ">
											<Path.RenderTransform>
												<TransformGroup>
													<ScaleTransform ScaleX=".9" ScaleY=".9"/>
													<RotateTransform x:Name="SortIconTransform"/>
												</TransformGroup>
											</Path.RenderTransform>
										</Path>
									</Grid>
								</ControlTemplate>
							</Setter.Value>
						</Setter>
					</Style>
				</Setter.Value>
			</Setter>
			<Setter Property="DropLocationIndicatorStyle">
				<Setter.Value>
					<Style TargetType="Control">
						<Setter Property="Background" Value="#FF3F4346"/>
						<Setter Property="Width" Value="2"/>
						<Setter Property="Template">
							<Setter.Value>
								<ControlTemplate TargetType="Control">
									<Rectangle Height="{TemplateBinding Height}" Width="{TemplateBinding Width}" Fill="{TemplateBinding Background}"/>
								</ControlTemplate>
							</Setter.Value>
						</Setter>
					</Style>
				</Setter.Value>
			</Setter>
			<Setter Property="GridLinesVisibility" Value="Vertical"/>
			<Setter Property="HorizontalGridLinesBrush" Value="#FFC9CACA"/>
			<Setter Property="IsTabStop" Value="True"/>
			<Setter Property="VerticalGridLinesBrush" Value="#FFC9CACA"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="data:DataGrid">
						<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2">
							<Grid x:Name="Root">
								<Grid.Resources>
									<ControlTemplate x:Key="TopLeftHeaderTemplate" TargetType="System_Windows_Controls_Primitives:DataGridColumnHeader">
										<Grid x:Name="Root">
											<Grid.RowDefinitions>
												<RowDefinition Height="*"/>
												<RowDefinition Height="*"/>
												<RowDefinition Height="Auto"/>
											</Grid.RowDefinitions>
											<Border Grid.RowSpan="2" Background="#FF1F3B53" BorderBrush="#FFC9CACA" BorderThickness="0,0,1,0">
												<Rectangle Stretch="Fill" StrokeThickness="1">
													<Rectangle.Fill>
														<LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
															<GradientStop Color="#FFFFFFFF" Offset="0.015"/>
															<GradientStop Color="#F9FFFFFF" Offset="0.375"/>
															<GradientStop Color="#E5FFFFFF" Offset="0.6"/>
															<GradientStop Color="#C6FFFFFF" Offset="1"/>
														</LinearGradientBrush>
													</Rectangle.Fill>
												</Rectangle>
											</Border>
											<Rectangle Height="1" VerticalAlignment="Bottom" Width="Auto" Grid.RowSpan="2" Fill="#FFDBDCDC" StrokeThickness="1"/>
										</Grid>
									</ControlTemplate>
									<ControlTemplate x:Key="TopRightHeaderTemplate" TargetType="System_Windows_Controls_Primitives:DataGridColumnHeader">
										<Grid x:Name="RootElement">
											<Grid.RowDefinitions>
												<RowDefinition Height="*"/>
												<RowDefinition Height="*"/>
												<RowDefinition Height="Auto"/>
											</Grid.RowDefinitions>
											<Border Grid.RowSpan="2" Background="#FF1F3B53" BorderBrush="#FFC9CACA" BorderThickness="1,0,0,0">
												<Rectangle Stretch="Fill">
													<Rectangle.Fill>
														<LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
															<GradientStop Color="#FFFFFFFF" Offset="0.015"/>
															<GradientStop Color="#F9FFFFFF" Offset="0.375"/>
															<GradientStop Color="#E5FFFFFF" Offset="0.6"/>
															<GradientStop Color="#C6FFFFFF" Offset="1"/>
														</LinearGradientBrush>
													</Rectangle.Fill>
												</Rectangle>
											</Border>
										</Grid>
									</ControlTemplate>
								</Grid.Resources>
								<Grid.ColumnDefinitions>
									<ColumnDefinition Width="Auto"/>
									<ColumnDefinition Width="*"/>
									<ColumnDefinition Width="Auto"/>
								</Grid.ColumnDefinitions>
								<Grid.RowDefinitions>
									<RowDefinition Height="Auto"/>
									<RowDefinition Height="*"/>
									<RowDefinition Height="Auto"/>
								</Grid.RowDefinitions>
								<System_Windows_Controls_Primitives:DataGridColumnHeader Template="{StaticResource TopLeftHeaderTemplate}" x:Name="TopLeftCornerHeader" Width="22"/>
								<System_Windows_Controls_Primitives:DataGridColumnHeadersPresenter x:Name="ColumnHeadersPresenter" Grid.Column="1"/>
								<System_Windows_Controls_Primitives:DataGridColumnHeader Template="{StaticResource TopRightHeaderTemplate}" x:Name="TopRightCornerHeader" Grid.Column="2"/>
								<Rectangle Height="1" x:Name="ColumnHeadersAndRowsSeparator" VerticalAlignment="Bottom" Width="Auto" Grid.ColumnSpan="3" Fill="#FFDBDCDC" StrokeThickness="1"/>
								<System_Windows_Controls_Primitives:DataGridRowsPresenter x:Name="RowsPresenter" Grid.ColumnSpan="2" Grid.Row="1"/>
								<Rectangle x:Name="BottomRightCorner" Grid.Column="2" Grid.Row="2" Fill="#FFE9EEF4"/>
								<Rectangle x:Name="BottomLeftCorner" Grid.ColumnSpan="2" Grid.Row="2" Fill="#FFE9EEF4"/>
								<ScrollBar Margin="0,-1,-1,-1" x:Name="VerticalScrollbar" Width="18" Grid.Column="2" Grid.Row="1" Orientation="Vertical"/>
								<Grid Grid.Column="1" Grid.Row="2">
									<Grid.ColumnDefinitions>
										<ColumnDefinition Width="Auto"/>
										<ColumnDefinition Width="*"/>
									</Grid.ColumnDefinitions>
									<Rectangle x:Name="FrozenColumnScrollBarSpacer"/>
									<ScrollBar Height="18" Margin="-1,0,-1,-1" x:Name="HorizontalScrollbar" Grid.Column="1" Orientation="Horizontal"/>
								</Grid>
							</Grid>
						</Border>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
	</UserControl.Resources>
	<Grid x:Name="LayoutRoot" Background="White">
		<data:DataGrid Height="154" Margin="60,64,199,0" VerticalAlignment="Top" Style="{StaticResource DataGridStyle1}">
			<data:DataGrid.Columns>
				<data:DataGridTextColumn Header="Column1"/>
				<data:DataGridTextColumn Header="Column2"/>
				<data:DataGridTemplateColumn Header="Column3"/>
			</data:DataGrid.Columns>
		</data:DataGrid>
	</Grid>
</UserControl>

无论我如何修改TopLeftHeaderTemplate或TopRightHeaderTemplate，都无法修改DataGrid列头的样式。

Answer 1

列头样式修改 HeaderStyle,做了个例子,修改了第一列的HeaderStyle

<UserControl xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:dataPrimitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data" xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"  x:Class="Social.DataGridHeadStyle.MainPage" 
    Width="400" Height="300">
	<UserControl.Resources>
		<Style x:Key="DataGridColumnHeaderStyleEg" TargetType="dataPrimitives:DataGridColumnHeader">
			<Setter Property="Foreground" Value="#FF000000"/>
			<Setter Property="HorizontalContentAlignment" Value="Left"/>
			<Setter Property="VerticalContentAlignment" Value="Center"/>
			<Setter Property="FontSize" Value="11"/>
			<Setter Property="IsTabStop" Value="False"/>
			<Setter Property="SeparatorBrush" Value="#FF00CACA"/>
			<Setter Property="Padding" Value="4"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="dataPrimitives:DataGridColumnHeader">
						<Grid x:Name="Root">
							<Grid.ColumnDefinitions>
								<ColumnDefinition/>
								<ColumnDefinition Width="Auto"/>
							</Grid.ColumnDefinitions>
							<vsm:VisualStateManager.VisualStateGroups>
								<vsm:VisualStateGroup x:Name="CommonStates">
									<vsm:VisualStateGroup.Transitions>
										<vsm:VisualTransition GeneratedDuration="00:00:0.1"/>
									</vsm:VisualStateGroup.Transitions>
									<vsm:VisualState x:Name="Normal"/>
									<vsm:VisualState x:Name="MouseOver">
										<Storyboard>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="(Fill).Color" To="#FF448DCA"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[3].Color" To="#7FFFFFFF"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[2].Color" To="#CCFFFFFF"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[1].Color" To="#F2FFFFFF"/>
										</Storyboard>
									</vsm:VisualState>
									<vsm:VisualState x:Name="Pressed">
										<Storyboard>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="(Fill).Color" To="#FF448DCA"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[0].Color" To="#D8FFFFFF"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[1].Color" To="#C6FFFFFF"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[2].Color" To="#8CFFFFFF"/>
											<ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Fill).(GradientStops)[3].Color" To="#3FFFFFFF"/>
										</Storyboard>
									</vsm:VisualState>
								</vsm:VisualStateGroup>
								<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 Duration="0" Storyboard.TargetName="SortIcon" Storyboard.TargetProperty="Opacity" To="1.0"/>
										</Storyboard>
									</vsm:VisualState>
									<vsm:VisualState x:Name="SortDescending">
										<Storyboard>
											<DoubleAnimation Duration="0" Storyboard.TargetName="SortIcon" Storyboard.TargetProperty="Opacity" To="1.0"/>
											<DoubleAnimation Duration="0" Storyboard.TargetName="SortIcon" Storyboard.TargetProperty="(RenderTransform).ScaleY" To="-.9"/>
										</Storyboard>
									</vsm:VisualState>
								</vsm:VisualStateGroup>
							</vsm:VisualStateManager.VisualStateGroups>
							<Rectangle x:Name="BackgroundRectangle" Fill="#FF1F3B53" Stretch="Fill" Grid.ColumnSpan="2"/>
							<Rectangle x:Name="BackgroundGradient" Stretch="Fill" Grid.ColumnSpan="2">
								<Rectangle.Fill>
									<LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
										<GradientStop Color="#FC00FFFF" Offset="0.015"/>
										<GradientStop Color="#F700FFFF" Offset="0.375"/>
										<GradientStop Color="#E5FFFFFF" Offset="0.6"/>
										<GradientStop Color="#D1FFFFFF" Offset="1"/>
									</LinearGradientBrush>
								</Rectangle.Fill>
							</Rectangle>
							<Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
								<Grid.ColumnDefinitions>
									<ColumnDefinition/>
									<ColumnDefinition Width="Auto"/>
								</Grid.ColumnDefinitions>
								<ContentPresenter Cursor="{TemplateBinding Cursor}" Content="{TemplateBinding Content}"/>
								<Path x:Name="SortIcon" Fill="#FF444444" Stretch="Uniform" HorizontalAlignment="Left" Margin="4,0,0,0" VerticalAlignment="Center" Width="8" Opacity="0" RenderTransformOrigin=".5,.5" Grid.Column="1" Data="F1 M -5.215,6.099L 5.215,6.099L 0,0L -5.215,6.099 Z ">
									<Path.RenderTransform>
										<ScaleTransform ScaleX=".9" ScaleY=".9"/>
									</Path.RenderTransform>
								</Path>
							</Grid>
							<Rectangle x:Name="VerticalSeparator" Fill="{TemplateBinding SeparatorBrush}" VerticalAlignment="Stretch" Width="1" Visibility="{TemplateBinding SeparatorVisibility}" Grid.Column="1"/>
						</Grid>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
			<Setter Property="Background" Value="#FF000000"/>
		</Style>
	</UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White">
        <data:DataGrid>
            <data:DataGrid.Columns>
                <data:DataGridTextColumn Header="第1列" HeaderStyle="{StaticResource DataGridColumnHeaderStyleEg}"/>
                <data:DataGridTextColumn Header="第2列" />
                <data:DataGridTextColumn Header="第3列" />
            </data:DataGrid.Columns>
        </data:DataGrid>
    </Grid>
</UserControl>

Answer 2

谢谢斑竹的帮助！
但DataGrid的HeaderStyle委实也神秘了一些，不太友好，希望SL将来的版本能把这部分做友好些！