使用Silverlight Toolkit TreeView(树形控件).doc

尽管在Silverlight Toolkit中有相关的DEMO来演示如何使用TreeView控件，但其还是有一些功能没被演示出来。因为在我们平时开发过程中，数据是被动态查询获取的（不是DEMO中的静态文件方式）。因此今天就演示一下如何使用WCF来获取相应数据并使用TreeView来动态加载相应结点信息。 首先，我们要创建一个WCF服务来获取相应的树形节点数据信息，如下： publicclassForumInfopublicintForumIDget;set;publicintParendIDget;set;publicstringForumNameget;set;ServiceContract(Namespace=)AspNetCompatibilityRequirements(RequirementsMode=AspNetCompatibilityRequirementsMode.Allowed)publicclassDateServiceOperationContractpublicListGetForumData()ListforumList=newList();forumList.Add(newForumInfo()ForumID=1,ParendID=0,ForumName=笔记本版块);forumList.Add(newForumInfo()ForumID=2,ParendID=0,ForumName=台式机版块);forumList.Add(newForumInfo()ForumID=3,ParendID=1,ForumName=Dell笔记本);forumList.Add(newForumInfo()ForumID=4,ParendID=1,ForumName=IBM笔记本);forumList.Add(newForumInfo()ForumID=5,ParendID=4,ForumName=IBM-T系列);forumList.Add(newForumInfo()ForumID=6,ParendID=4,ForumName=IBM-R系列);forumList.Add(newForumInfo()ForumID=7,ParendID=2,ForumName=联想台式机);forumList.Add(newForumInfo()ForumID=8,ParendID=2,ForumName=方正台式机);forumList.Add(newForumInfo()ForumID=9,ParendID=2,ForumName=HP台式机);forumList.Add(newForumInfo()ForumID=10,ParendID=7,ForumName=联想家悦H系列);forumList.Add(newForumInfo()ForumID=11,ParendID=7,ForumName=联想IdeaCentre系列);returnforumList; 从代码中可看出，ForumInfo是使用ParendID来记录父结点信息并以此来创建一个树形结构的，而方法：GetForumData()即是演示了我们平时查询数据的过程。我们在Silverlight中添加对该服务的引用即可。 我们在Silverlight中添加对Silverlight Toolkit相关DLL引用，然后向XAML文件上拖入一个TREEVIEW控件。并将其命名为“TreeOfLife”，最后我们再放几个TextBlock来显示树形结点被点击后显示的相应的ForumInfo信息。最后XAML中的内容如下所示： 下面是相应的XAML.CS文件中的内容，主要是使用递归方式遍历数据列表并创建相关的结点信息： publicpartialclassPage:UserControlDateServiceClientdataServiceClient=newDateServiceClient();ObservableCollectionforumList=newObservableCollection();publicPage()InitializeComponent();/此样式只添加在根结点上/TreeOfLife.ItemContainerStyle=this.ResourcesRedItemStyleasStyle;dataServiceClient.GetForumDataCompleted+=newEventHandler(dataServiceClient_GetForumDataCompleted);dataServiceClient.GetForumDataAsync();voiddataServiceClient_GetForumDataCompleted(objectsender,GetForumDataCompletedEventArgse)tryforumList=e.Result;AddTreeNode(0,null);catchthrownewNotImplementedException();privatevoidAddTreeNode(intparentID,TreeViewItemtreeViewItem)Listresult=(fromforumInfoinforumListwhereforumInfo.ParendID=parentIDselectforumInfo).ToList();if(result.Count0)foreach(ForumInfoforuminfoinresult)TreeViewItemobjTreeNode=newTreeViewItem();objTreeNode.Header=foruminfo.ForumName;objTreeNode.DataContext=foruminfo;/此样式将会添加的所有叶子结点上/objTreeNode.ItemContainerStyle=this.ResourcesRedItemStyleasStyle;/添加根节点if(treeViewItem=null)TreeOfLife.Items.Add(objTreeNode);elsetreeViewItem.Items.Add(objTreeNode);AddTreeNode(foruminfo.ForumID,objTreeNode);privatevoidTreeOfLife_SelectedItemChanged(objectsender,RoutedPropertyChangedEventArgse)TreeViewItemitem=e.NewValueasTreeViewItem;ForumInfofi=item.DataContextasForumInfo;DetailsPanel.DataContext=fi; 下面演示一下效果，如下图所示： 当前TreeView控件还支持样式定义，比如可以给每个树形结点前添加CheckBox和一个小图标，这里我们使用下面样式： 然后在cs文件中使用下面语句将该样式绑定到TreeView上： TreeOfLife.ItemContainerStyle=this.ResourcesRedItemStyleasStyle; 下面