上一篇 对Wpf/Silverlight Template 进行了总结，本篇继续上一篇，主要是介绍 HierarchicalDataTemplate 的使用方法。HierarchicalDataTemplate 继承于DataTemplate，被称之为"层级式数据模板"，主要是应用层级比较明显数据集合，其典型的应用就是对TreeView控件进行数据绑定，接下来就在Silverlight 5 下进行一下演示。最近有个卖凉茶的节目比较火，叫中国好声音，里面的导师和其歌手的分组就是个层级结构，我们暂且先用它来做个例子吧。

首先我们需要准备一下层级的数据集合，定义一个歌手类：

歌手类

然后定义一个 导师类，导师类中有个属性就是歌手的集合，代码如下：

导师类

接下来用代码组织一个导师与歌手的层级数据集合：

好声音层级数据集合

有了数据集合，我们就可以在Xaml中编写我们的 HierarchicalDataTemplate 模版了，我们定义两个模版，一个TeacherTemplate 代表导师节点，一个SingerTemplate 代表歌手节点，并把TeacherTemplate中的ItemTemplate指定为SingerTemplate，具体代码如下： 

<common:HierarchicalDataTemplate x:Key="SingerTemplate"> <StackPanel Orientation="Horizontal"> <Image Source="{Binding SingerHeader}"/> <TextBlock Text="{Binding SingerName}" Margin="2,0,0,0" VerticalAlignment="Center" FontSize="12" Foreground="Green" /> </StackPanel> </common:HierarchicalDataTemplate> <common:HierarchicalDataTemplate x:Key="TeacherTemplate" ItemsSource="{Binding SingerList}" ItemTemplate="{StaticResource SingerTemplate}"> <StackPanel Orientation="Horizontal"> <Image Source="{Binding TeacherHeader}" /> <TextBlock Text="{Binding TeacherName}" Margin="2,0,0,0" HorizontalAlignment="Center" FontSize="14" Foreground="Blue"/> </StackPanel> </common:HierarchicalDataTemplate>

在Silverlight下，需要在Xaml代码中添加如下命名空间：xmlns:common="clr-namespace:System.Windows;assembly=System.Windows.Controls" 

在此之后，在主界面MainPage.xaml 中添加一个TreeView控件，并给该控件增加一个根节点，命名为 RootItem，并把该根节点的ItemTemplate指定为我们刚刚编写的层级模版中的 TeacherTemplate：

<sdk:TreeView x:Name="GoodVoiceTree" Grid.Row="1" Grid.Column="0" HorizontalAlignment="Stretch" VerticalContentAlignment="Stretch"> <sdk:TreeViewItem x:Name="RootItem" ItemTemplate="{StaticResource TeacherTemplate}" IsExpanded="True"> <sdk:TreeViewItem.HeaderTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Image Source="images/中国好声音.png"/> <TextBlock Text="中国好声音" Margin="2,0,0,0" VerticalAlignment="Center" FontSize="16" Foreground="Red" /> </StackPanel> </DataTemplate> </sdk:TreeViewItem.HeaderTemplate> </sdk:TreeViewItem> </sdk:TreeView>

接下来，我们为该树控件的根节点RootItem绑定我们的数据集合就可以展现我们的树形控件了：

this.RootItem.ItemsSource = GoodVoice.GoodVoiceData;

运行结果如下图：

其实在我们的实际开发项目中有些数据的层级结构是固定的，比如上面的例子，就固定了导师和歌手两个层级，固定的层级的话我们可以对每一层的样式方便的进行控制（直接在每层的模版中制作就可以）。但还有很多的时候，数据的层级是不固定的，我们也来进行一下简单的演示：

首先定义个TreeNode类，代表每层的数据模型：

TreeNode 代码

同样用代码组织一个层级数据集合：

TreeNodeData

在Xaml中编写的层级模版：