Silverlight Treeview Control
Treeview control is used to display hierarchical data in tree structure. It contain parent and child nodes with collapse and expand.
To use silverlight control toolkit first add a reference to the
Microsoft.Windows.Controls.dll.
xmlns:controls=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit”
silverlight-toolkit--reference
Step1: Open Page.xaml control in Silverlight application
<UserControl x:Class=”AddingXAML.Page”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
Width=”400″ Height=”300″>
<Grid x:Name=”LayoutRoot” Background=”White”>
</Grid>
</UserControl>
Step2: Drag Treeview Control it generates silverlight toolkit namespace and treeview syntax
//silverlight toolkit namespace
xmlns:controls=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit”
code Generates after draging Treeview control:
<UserControl x:Class=”AddingXAML.Page”
xmlns:controls=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
Width=”400″ Height=”300″>
<Grid x:Name=”LayoutRoot” Background=”White”>
<controls:TreeView></controls:TreeView>
</Grid>
</UserControl>
Step3: To add parent and child items to silverlight Treeview control use TreeviewItem
<controls:TreeViewItem Header=”Root” IsSelected=”True” IsExpanded=”True” >
<controls:TreeViewItem Header=”Parent” IsExpanded=”True” >
<controls:TreeViewItem Header=”child A“></controls:TreeViewItem>
<controls:TreeViewItem Header=”Child B></controls:TreeViewItem>
<controls:TreeViewItem Header=”Child C“></controls:TreeViewItem>
</controls:TreeViewItem>
</controls:TreeViewItem>
Example 1: Sample code for Silverlight Treeview Control
<UserControl x:Class=”AddingXAML.Page” xmlns:controls=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
xmlns:exp=”clr-namespace:AddingXAML”
Width=”400″ Height=”400″>
<Grid x:Name=”LayoutRoot” Background=”White”>
<controls:TreeView BorderBrush=”Black” BorderThickness=”2″ Width=”200″ Background=”Cornsilk”>
<controls:TreeViewItem Header=”Home” IsSelected=”True” IsExpanded=”True” >
<controls:TreeViewItem Header=”Languages” IsExpanded=”True” >
<controls:TreeViewItem Header=”C “></controls:TreeViewItem>
<controls:TreeViewItem Header=”C++“></controls:TreeViewItem>
<controls:TreeViewItem Header=”Pascal“></controls:TreeViewItem>
</controls:TreeViewItem>
<controls:TreeViewItem Header=”Web Technologies” IsExpanded=”True”>
<controls:TreeViewItem Header=”Asp.net“></controls:TreeViewItem>
<controls:TreeViewItem Header=”Silverlight“></controls:TreeViewItem>
<controls:TreeViewItem Header=”MVC“></controls:TreeViewItem> </controls:TreeViewItem>
</controls:TreeViewItem>
</controls:TreeView>
</Grid>
</UserControl>
Example 2: Sample code for Treeview with Contentcontrol and HyperlinkButton
<UserControl xmlns:controls=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit” x:Class=”AddingXAML.Page”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
Width=”400″ Height=”300″>
<Grid x:Name=”LayoutRoot” Background=”White”>
<controls:TreeView BorderBrush=”Black” BorderThickness=”2″ Width=”200″ Background=”Cornsilk”>
<controls:TreeViewItem Header=”Home” IsSelected=”True” IsExpanded=”True” >
<controls:TreeViewItem Header=”Languages” IsExpanded=”True” >
<ContentControl>
<HyperlinkButton NavigateUri=”http://www.cprogramming.com/tutorial.html” Content=”C” TargetName=”_blank”></HyperlinkButton>
</ContentControl>
<ContentControl>
<HyperlinkButton NavigateUri=”http://www.cprogramming.com/tutorial.html” Content=”C++” TargetName=”_blank”></HyperlinkButton>
</ContentControl>
<ContentControl>
<HyperlinkButton NavigateUri=”http://www.c-sharpcorner.com/” Content=”CSharp” TargetName=”_blank” ></HyperlinkButton>
</ContentControl>
</controls:TreeViewItem>
<controls:TreeViewItem Header=”Web Technologies” IsExpanded=”True”>
<ContentControl>
<HyperlinkButton NavigateUri=”http://www.asp.net/” Content=”Asp.Net” TargetName=”_blank”></HyperlinkButton>
</ContentControl>
<ContentControl>
<HyperlinkButton NavigateUri=”http://silverlight.net/GetStarted/” Content=”Silverlight” TargetName=”_blank”></HyperlinkButton>
</ContentControl>
<ContentControl>
<HyperlinkButton NavigateUri=”http://www.asp.net/mvc/” Content=”MVC” TargetName=”_blank” ></HyperlinkButton>
</ContentControl>
</controls:TreeViewItem>
</controls:TreeViewItem>
</controls:TreeView>
</Grid>
</UserControl>
