在項(xiàng)目開發(fā)中，常常需要以樹的形式來組織數(shù)據(jù)的層次關(guān)系，最常用的控件莫過于TreeView了，本文就是對如何在TreeView中實(shí)現(xiàn)分層數(shù)據(jù)顯示進(jìn)行介紹。

　　固定內(nèi)容的樹

　　當(dāng)TreeView中的內(nèi)容為固定值的時(shí)候，我們可以直接使用xaml對其內(nèi)容進(jìn)行設(shè)置，而不必使用代碼綁定，這樣做的好處是設(shè)置簡單且系統(tǒng)負(fù)擔(dān)較輕。

　　示例代碼如下：

<sdk:TreeView Name="tviSample" VerticalAlignment="Top"> 
   <sdk:TreeViewItem Header="茶" > 
     <sdk:TreeViewItem Header="鐵觀音"> 
       <sdk:TreeViewItem Header="福建"></sdk:TreeViewItem> 
       <sdk:TreeViewItem Header="云南"></sdk:TreeViewItem> 
     </sdk:TreeViewItem> 
       <sdk:TreeViewItem Header="龍井"></sdk:TreeViewItem> 
       <sdk:TreeViewItem Header="茉莉花"></sdk:TreeViewItem> 
     </sdk:TreeViewItem> 
     <sdk:TreeViewItem Header="書"> 
       <sdk:TreeViewItem Header="計(jì)算機(jī)類"> 
             <sdk:TreeViewItem Header="銀光志"></sdk:TreeViewItem> 
       </sdk:TreeViewItem> 
       <sdk:TreeViewItem Header="歷史小說類"> 
         <sdk:TreeViewItem Header="明朝那些事兒"></sdk:TreeViewItem> 
         <sdk:TreeViewItem Header="歷史是個(gè)什么玩意兒"></sdk:TreeViewItem> 
       </sdk:TreeViewItem> 
     </sdk:TreeViewItem> 
</sdk:TreeView>

　　在Visual Studio IDE中通過設(shè)置TreeView的Items屬性,可以很快的為樹添加子成員,也可為子成員(ListViewItem)繼續(xù)添加子成員。

　　動(dòng)態(tài)綁定內(nèi)容的樹

　　但是絕大多數(shù)的情況下，樹的內(nèi)容是需要通過代碼動(dòng)態(tài)生成的，對于動(dòng)態(tài)生成的樹，可以使用下面的實(shí)例代碼來實(shí)現(xiàn)和上述xaml代碼一樣的效果(雖然這樣做意義不大…)：

<sdk:TreeView Name="tviSample" VerticalAlignment="Top"> 
</sdk:TreeView>
public MainPage() 
{ 
   InitializeComponent(); 
  
   TreeViewItem tviItem = new TreeViewItem() { Header =  "茶" }; 
   TreeViewItem tviSubItem=new TreeViewItem(){ Header= "鐵觀音"}; 
   tviSubItem.Items.Add(new TreeViewItem() { Header =  "福建" }); 
   tviSubItem.Items.Add(new TreeViewItem() { Header =  "云南" }); 
   tviItem.Items.Add(tviSubItem); 
   tviSubItem = new TreeViewItem() { Header =  "龍井" }; 
   tviItem.Items.Add(tviSubItem); 
   tviSubItem = new TreeViewItem() { Header =  "茉莉花" }; 
   tviItem.Items.Add(tviSubItem); 
   tviSample.Items.Add(tviItem); 
  
   tviItem = new TreeViewItem() { Header =  "書" }; 
   tviSubItem = new TreeViewItem() { Header =  "計(jì)算機(jī)" }; 
   tviSubItem.Items.Add(new TreeViewItem() { Header =  "銀光志" }); 
   tviItem.Items.Add(tviSubItem); 
   tviSubItem = new TreeViewItem() { Header =  "歷史小說" }; 
   tviSubItem.Items.Add(new TreeViewItem() { Header =  "明朝那些事兒" }); 
   tviItem.Items.Add(tviSubItem); 
   tviSample.Items.Add(tviItem); 
}

　　上面的例子雖然是使用代碼為樹添加子節(jié)點(diǎn)或葉子節(jié)點(diǎn),但是在實(shí)際的項(xiàng)目開發(fā)中,我們更多的是使用一個(gè)自定義的數(shù)據(jù)源,比如說ObservableCollection(使用這個(gè)類需要引入 System.Collections.ObjectModel命名空間)的一個(gè)對象來綁定到樹的數(shù)據(jù)源上,再將對象的某系字段綁定到樹的模板上。這個(gè)時(shí)候，就該 HierarchicalDataTemplate 閃亮登場了，HierarchicalDataTemplate就是專門用來配合TreeView實(shí)現(xiàn)數(shù)據(jù)綁定效果的,如以下代碼所示:

<sdk:TreeView Name="tviSample" ItemsSource="{Binding}"VerticalAlignment="Top"> 
   <sdk:TreeView.ItemTemplate> 
     <sdk:HierarchicalDataTemplate ItemsSource="{Binding Path=SubItems}"> 
       <StackPanel Orientation="Horizontal"> 
         <TextBlock Text="{Binding Path=GoodsName}"></TextBlock> 
       </StackPanel> 
     </sdk:HierarchicalDataTemplate> 
   </sdk:TreeView.ItemTemplate> 
</sdk:TreeView>
public partial class MainPage : UserControl 
{ 
   public MainPage() 
   { 
     InitializeComponent(); 
   } 
  
   private void LayoutRoot_Loaded(object sender, RoutedEventArgs e) 
   { 
     ObservableCollection currentGoods = new ObservableCollection(); 
     currentGoods.Add(new Goods() { GoodsName =  "書1", GoodsId = 1 }); 
     currentGoods.Add(new Goods() { GoodsName =  "書2", GoodsId = 2 }); 
     tviSample.DataContext = currentGoods; 
   } 
} 
public class Goods 
{ 
   public string GoodsName { get; set; } 
   public int GoodsId { get; set; } 
   public Goods() { } 
   public Goods(string GoodsName, int GoodsId) 
   { 
     this.GoodsId = GoodsId; 
     this.GoodsName = GoodsName; 
   } 
 

　　以上實(shí)例實(shí)現(xiàn)了一層的綁定，想實(shí)現(xiàn)兩層綁定該如何處理?請看下面示例代碼:

<Grid x:Name="LayoutRoot" Loaded="LayoutRoot_Loaded"> 
   <Grid.Resources> 
     <sdk:HierarchicalDataTemplate x:Key="ChildTemplate" > 
       <TextBlock Text="{Binding Path=GoodsName}"></TextBlock> 
     </sdk:HierarchicalDataTemplate> 
     <sdk:HierarchicalDataTemplate x:Key="RootTemplate" ItemsSource=

"{Binding SubItems}" temTemplate="{StaticResource ChildTemplate}" > 
       <TextBlock Text="{Binding Path=GoodsName}"></TextBlock> 
     </sdk:HierarchicalDataTemplate> 
   </Grid.Resources> 
   <sdk:TreeView ItemTemplate="{StaticResource RootTemplate}" Name=

"tviSample" ItemsSource="{Binding}"> 
   </sdk:TreeView> 
</Grid>
public partial class MainPage : UserControl 
{ 
   public MainPage() 
   { 
     InitializeComponent(); 
   } 
  
   private void LayoutRoot_Loaded(object sender, RoutedEventArgs e) 
   { 
     ObservableCollection currentGoods = new ObservableCollection(); 
  
     currentGoods.Add(new Goods() { GoodsName =  "書1", GoodsId = 1 }); 
     currentGoods.Add(new Goods() { GoodsName =  "書2", GoodsId = 2 }); 
  
     currentGoods[0].SubItems.Add(new Goods() { GoodsName =  "書11", GoodsId = 11 }); 
     currentGoods[0].SubItems.Add(new Goods() { GoodsName =  "書12", GoodsId = 12 }); 
     currentGoods[0].SubItems.Add(new Goods() { GoodsName =  "書13", GoodsId = 13 }); 
  
     tviSample.DataContext = currentGoods; 
   } 
} 
public class Goods 
{ 
   public string GoodsName { get; set; } 
   public int GoodsId { get; set; } 
   public ObservableCollection SubItems { get; set; } 
  
   public Goods() { SubItems = new ObservableCollection(); } 
   public Goods(string GoodsName, int GoodsId):this() 
   { 
     this.GoodsId = GoodsId; 
     this.GoodsName = GoodsName; 
   } 
}