在Silverlight中使用HierarchicalDataTemplate为TreeView实现递归树状结构

将实体绑定到TreeView控件,实现树状结构的显示,如下图所示。这个功能通过HierarchicalDataTemplate实现。

 

1. 业务实体

作为举例,我定义了一个大家都很熟悉的Folder类型,即文件夹。我们都知道,文件夹又可以包含子文件夹,而且可以多层嵌套。所以,这是一个递归的结构体。

public class Folder

{

public string Name { get; set; }

public ObservableCollection<Folder> Folders { get; set; }

}

2. 准备数据

用下面的代码,模拟一个数据读取操作。下面是硬编码出来的数据。实际情况下,可以读取数据库。

void MainPage_Loaded(object sender, RoutedEventArgs e)

{

var result = new[]{

new Folder(){Name="Test",Folders =new ObservableCollection<Folder>(

new[]{

new Folder(){Name="Test4"},

new Folder(){Name="Test3"},

new Folder(){Name="Test4",Folders=new ObservableCollection<Folder>(

new []{new Folder(){Name ="Test5"}})

}

})}};

 

tvFolders.ItemsSource = result;

}

3. 绑定控件

<UserControl x:Class="SilverlightTreeviewSample.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"

mc:Ignorable="d"

d:DesignHeight="300" d:DesignWidth="400" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">

 

<UserControl.Resources>

<sdk:HierarchicalDataTemplate x:Key="FolderItemTemplate" ItemsSource="{Binding Folders}">

<TextBlock Text="{Binding Name}"></TextBlock>

</sdk:HierarchicalDataTemplate>

<Style TargetType="sdk:TreeViewItem">

<Setter Property="IsExpanded" Value="True"></Setter>

</Style>

 

</UserControl.Resources>

 

<Grid x:Name="LayoutRoot" Background="White">

<sdk:TreeView Name="tvFolders" ItemTemplate="{StaticResource FolderItemTemplate}">

 

</sdk:TreeView>

</Grid>

</UserControl>

请注意,我们这里用到一个特殊的DataTemplateHierarchicalDataTemplate,并且将其设置为TreeviewItemTemplate

   

 

你可能感兴趣的:(在Silverlight中使用HierarchicalDataTemplate为TreeView实现递归树状结构)