【问题标题】：How to customize the DataGrid headers in Silverlight?如何在 Silverlight 中自定义 DataGrid 标头？
【发布时间】：2012-04-05 04:20:57
【问题描述】：
我刚刚开始学习 Silverlight 及其控件。我很确定我们可以像 JQuery 和 Flex 等其他技术一样使用 silverlight 为数据网格创建这种标题。但我不知道该怎么做。有人可以推荐一些示例或网站，让我可以学习自定义这样的标题吗？
_______________________________________________________
| Name | Age | Marks |
|_____________________| |___________________|
|First Name| Last Name| |Sub1 | Sub2 |Sub3 |
|_____________________|___________|___________________|
【问题讨论】：
标签：
c#-4.0
silverlight-4.0
datagrid
【解决方案1】：
在 Xaml 中试用此代码：
<UserControl x:Class="SilverlightApplication16.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
xmlns:dataprimitives="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows.Controls.Data"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<UserControl.Resources>
<Style x:Key="DataGridBaseHeaderStyle"
TargetType="dataprimitives:DataGridColumnHeader">
<Setter Property="FontWeight" Value="Bold" />
</Style>
<Style x:Key="NameHeaderStyle" TargetType="dataprimitives:DataGridColumnHeader"
BasedOn="{StaticResource DataGridBaseHeaderStyle}">
<Setter Property="Foreground" Value="#FF000000"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="SeparatorBrush" Value="#FFC9CACA"/>
<Setter Property="Padding" Value="8"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Grid x:Name="Root">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<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="#FCFFFFFF" Offset="0.015"/>
<GradientStop Color="#F7FFFFFF" Offset="0.375"/>
<GradientStop Color="#E5FFFFFF" Offset="0.6"/>
<GradientStop Color="#D1FFFFFF" Offset="1"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="1" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="1" />
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<!-- Row 0 -->
<ContentPresenter Content="Name"
VerticalAlignment="Center" HorizontalAlignment="Center" Grid.ColumnSpan="3" />
<!-- Row 1 -->
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Height="1" Visibility="Visible" Grid.Row="1" Grid.ColumnSpan="3" />
<!-- Row 2 -->
<ContentPresenter Content="First Name " Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center" />
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" Visibility="Visible" Grid.Row="2" Grid.Column="1" />
<ContentPresenter Content="Last Name" Grid.Row="2" Grid.Column="2" VerticalAlignment="Center" HorizontalAlignment="Center" />
</Grid>
<Rectangle x:Name="VerticalSeparator" Fill="#FFC9CACA"
VerticalAlignment="Stretch" Width="1" Visibility="Visible"
Grid.Row="1" Grid.Column="1"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="MarkHeaderStyle" TargetType="dataprimitives:DataGridColumnHeader" BasedOn="{StaticResource DataGridBaseHeaderStyle}">
<Setter Property="Foreground" Value="#FF000000"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="SeparatorBrush" Value="#FFC9CACA"/>
<Setter Property="Padding" Value="8"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Grid x:Name="Root">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<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="#FCFFFFFF" Offset="0.015"/>
<GradientStop Color="#F7FFFFFF" Offset="0.375"/>
<GradientStop Color="#E5FFFFFF" Offset="0.6"/>
<GradientStop Color="#D1FFFFFF" Offset="1"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" >
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="1" />
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="1" />
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="1" />
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<!-- Row 0 -->
<ContentPresenter Content="Marks" VerticalAlignment="Center" HorizontalAlignment="Center" Grid.ColumnSpan="6" />
<!-- Row 1 -->
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Height="1" Visibility="Visible" Grid.Row="1" Grid.ColumnSpan="5" />
<!-- Row 2 -->
<ContentPresenter Content="Sub1" Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center" />
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" Visibility="Visible" Grid.Row="2" Grid.Column="1" />
<ContentPresenter Content="Sub2" Grid.Row="2" Grid.Column="2" VerticalAlignment="Center" HorizontalAlignment="Center" />
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" Visibility="Visible" Grid.Row="2" Grid.Column="3" />
<ContentPresenter Content="Sub3" Grid.Row="2" Grid.Column="4" VerticalAlignment="Center" HorizontalAlignment="Center" />
</Grid>
<Rectangle x:Name="VerticalSeparator" Fill="#FFC9CACA"
VerticalAlignment="Stretch" Width="1" Visibility="Visible"
Grid.Row="1" Grid.Column="1"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<sdk:DataGrid AutoGenerateColumns="False" Height="100" HorizontalAlignment="Left" Margin="12,101,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="598">
<sdk:DataGrid.Columns>
<sdk:DataGridTemplateColumn Header="Tue" HeaderStyle="{StaticResource NameHeaderStyle}">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox Text="{Binding FistName}"/>
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" />
<TextBox Text="{Binding LastName}" Margin="2,0,0,0"/>
</StackPanel>
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
<sdk:DataGridTemplateColumn HeaderStyle="{StaticResource DataGridBaseHeaderStyle}" CanUserReorder="True" Header="Age" CanUserResize="True" CanUserSort="True" Width="Auto" />
<sdk:DataGridTemplateColumn Header="Tue" HeaderStyle="{StaticResource MarkHeaderStyle}">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox Text="{Binding Subject1}"/>
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" />
<TextBox Text="{Binding Subject2}" Margin="2,0,0,0"/>
<Rectangle Fill="#FFC9CACA" VerticalAlignment="Stretch" Width="1" />
<TextBox Text="{Binding Subject3}" Margin="2,0,0,0"/>
</StackPanel>
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
</sdk:DataGrid.Columns>
</sdk:DataGrid>
</Grid>