.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
 
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
david stephan

Home >> Articles >> Silverlight >> Post New Resource Bookmark and Share   

 Subscribe to Articles

Create Treeview in Silverlight : Tutorial

Posted By:Diptimaya Patra       Posted Date: March 18, 2010    Points: 25    Category: Silverlight    URL: http://www.dotnetspark.com  

Create Treeview in Silverlight Tutorial. In this Tutorial we will explore about Tree View control in Silverlight 3. We will see how can we expand and Collapse all in a single go
 

Introduction

In this article we will explore about Tree View control in Silverlight 3. We will see how can we expand and Collapse all in a single go.

Creating Silverlight Project

Fire up Expression Blend 3 and create a Silverlight Application. Name it as ExpandCollapseTreeViewSL3.

ima1.gif

Now go ahead and add a Tree View control to your application.

Then you can add TreeViewItem into your Tree View.

ima2.gif

Add several, and if you want to add children of any parent then select the particular TreeViewItem and add another Treeview Item.

I have created the below hierarchy:

ima3.gif

If you see the design view, it will look similar to the following:

ima4.gif

Here is the XAML code behind for the TreeView:


  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  


We will see how can we Expand all or Collapse all in a single button click.

Add two Buttons to your application saying Expand All and Collapse all.

ima5.gif

ima6.gif

Now add Click Events for the above two Buttons.


Expanding All

Now in the Event Handler for btnExapnd write the following code:

private void btnExpand_Click(object sender, System.Windows.RoutedEventArgs e)
{
for (int i = 0; i < MyTreeView.Items.Count; i++)
{
ExpandAllTreeViewItems((TreeViewItem)MyTreeView.ItemContainerGenerator.ContainerFromIndex(i));
}
}

Add the method ExpandAllTreeViewItems, and add following code:

private void ExpandAllTreeViewItems(TreeViewItem currentTreeViewItem)
{
if (!currentTreeViewItem.IsExpanded)
{
currentTreeViewItem.IsExpanded = true;
currentTreeViewItem.Dispatcher.BeginInvoke(() => ExpandAllTreeViewItems(currentTreeViewItem));
}
else
{
for (int i = 0; i < currentTreeViewItem.Items.Count; i++)
{
TreeViewItem child = (TreeViewItem)currentTreeViewItem.ItemContainerGenerator.ContainerFromIndex(i);
ExpandAllTreeViewItems(child);
}
}
}

Collapsing All

Now in the Event Handler of btnExpandAll add the following code:

private void btnCollapse_Click(object sender, RoutedEventArgs e)
{
for (int i = 0; i < MyTreeView.Items.Count; i++)
{
CollapseAllTreeViewItems((TreeViewItem)MyTreeView.ItemContainerGenerator.ContainerFromIndex(i));
}
}


Add the method CollapseAllTreeViewItems, and add the following code:

private void CollapseAllTreeViewItems(TreeViewItem rootTreeViewItem)
{
Stack treeViewItemsStack = new Stack();
treeViewItemsStack.Push(rootTreeViewItem);
while (treeViewItemsStack.Count != 0)
{
TreeViewItem current = treeViewItemsStack.Pop();
current.IsExpanded = false;
for (int i = 0; i < current.Items.Count; i++)
{
treeViewItemsStack.Push(current.ItemContainerGenerator.ContainerFromIndex(i) as TreeViewItem);
}
}
}

That's it we are done, now run your application to see the Expand All and Collapse All Buttons in action.

ima7.gif

Enjoy Coding.

 Subscribe to Articles

     

Further Readings:

Responses

No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More Articles on C#, ASP.Net, Vb.Net, SQL Server and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend