WPF中的TreeView入門最近在用WPF做開發(fā)，項(xiàng)目進(jìn)展的還算順利，WPF總體來說還是比較方便的，其中變化最大的主要是Listview和Treeview控件，而且TreeView似乎在WPF是一個(gè)備受指責(zé)的控件，很多人說他不好用。其實(shí)我覺得是開發(fā)人員沒有掌握好WPF中所傳承的MVC思想。在View方面，WPF中的TreeView給了開發(fā)人員更大的靈活性，開發(fā)人可以非常簡(jiǎn)單定制每個(gè)Node乃至整棵樹的外形。同時(shí)新的TreeView可以接受各種Collection作為ItemSource，非常靈活。只要簡(jiǎn)單地了解這些新加入的概念，開發(fā)起來就可以得心應(yīng)手。 首先一個(gè)簡(jiǎn)單的Demo
如果這實(shí)現(xiàn)這個(gè)Demo呢？我們從MVC三個(gè)方面入手： TreeView的View在WPF的TreeView，你可以定制每個(gè)節(jié)點(diǎn)的顯示方式，包括為一個(gè)節(jié)點(diǎn)添加多個(gè)圖標(biāo)，這些都只需要在XAML中配置，而不必留下復(fù)雜的C#代碼。例如： 1: <TreeView Name="tvProperties" Width="250" Padding="0" Margin="0" BorderThickness="1"> 2: <TreeView.ItemTemplate> 3: <HierarchicalDataTemplate DataType="{x:Type local:PropertyNodeItem}" ItemsSource="{Binding Path=Children}">4: <StackPanel Orientation="Horizontal"> 5: <Image VerticalAlignment="Center" Source="{Binding Icon}" Width="16" Height="16" Margin="0,0,2,2"></Image> 6: <TextBlock VerticalAlignment="Center" Text="{Binding DisplayName}"></TextBlock> 7: <Image VerticalAlignment="Center" Source="{Binding EditIcon}" Margin="2,0,0,0"></Image>8: <StackPanel.ToolTip> 9: <TextBlock VerticalAlignment="Center" Text="{Binding Name}" TextWrapping="Wrap" MaxWidth="200" ></TextBlock>10: </StackPanel.ToolTip> 11: </StackPanel> 12: </HierarchicalDataTemplate> 13: </TreeView.ItemTemplate> 14: </TreeView> 在這里我定義了一個(gè)簡(jiǎn)單的TreeView，每個(gè)節(jié)點(diǎn)對(duì)應(yīng)的DataType是PropertyNodeItem（稍后，我會(huì)給出它的定義），每個(gè)節(jié)點(diǎn)的內(nèi)容包括：
TreeView的Model 這里就是剛才說講到的PropertyNodeItem的定義 1: internal class PropertyNodeItem 2: { 3: public string Icon { get; set; } 4: public string EditIcon { get; set; } 5: public string DisplayName { get; set; } 6: public string Name { get; set; }7: 8: public List<PropertyNodeItem> Children { get; set; }9: public PropertyNodeItem() 10: {11: Children = new List<PropertyNodeItem>(); 12: } 13: } 其中Children里面保存的是子節(jié)點(diǎn)。在剛才的View里面，我們把HierarchicalDataTemplate的ItemSource定義為PropertyNodeItem的Children熟悉，這樣只要Children不為空，TreeView就會(huì)繼續(xù)渲染Children中的對(duì)象，并且遞歸下去。
TreeView的Controller 這里的Controller，我寫在xaml.cs里面： 1: private void ShowTreeView() 2: {3: List<PropertyNodeItem> itemList = new List<PropertyNodeItem>(); 4: PropertyNodeItem node1 = new PropertyNodeItem() 5: {6: DisplayName = "Node No.1", 7: Name = "This is the discription of Node1. This is a folder.", 8: Icon = FOLDER_ICON, 9: }; 10: 11: PropertyNodeItem node1tag1 = new PropertyNodeItem() 12: {13: DisplayName = "Tag No.1", 14: Name = "This is the discription of Tag 1. This is a tag.", 15: Icon = TAG_ICON, 16: EditIcon = EDITABLE_ICON 17: }; 18: node1.Children.Add(node1tag1); 19: 20: PropertyNodeItem node1tag2 = new PropertyNodeItem() 21: {22: DisplayName = "Tag No.2", 23: Name = "This is the discription of Tag 2. This is a tag.", 24: Icon = TAG_ICON, 25: EditIcon = EDITABLE_ICON 26: }; 27: node1.Children.Add(node1tag2); 28: itemList.Add(node1); 29: 30: PropertyNodeItem node2 = new PropertyNodeItem() 31: {32: DisplayName = "Node No.2", 33: Name = "This is the discription of Node 2. This is a folder.", 34: Icon = FOLDER_ICON, 35: }; 36: 37: PropertyNodeItem node2tag3 = new PropertyNodeItem() 38: {39: DisplayName = "Tag No.3", 40: Name = "This is the discription of Tag 3. This is a tag.", 41: Icon = TAG_ICON, 42: EditIcon = EDITABLE_ICON 43: }; 44: node2.Children.Add(node2tag3); 45: 46: PropertyNodeItem node2tag4 = new PropertyNodeItem() 47: {48: DisplayName = "Tag No.4", 49: Name = "This is the discription of Tag 4. This is a tag.", 50: Icon = TAG_ICON, 51: EditIcon = EDITABLE_ICON 52: }; 53: node2.Children.Add(node2tag4); 54: itemList.Add(node2); 55: 56: this.tvProperties.ItemsSource = itemList; 57: } 以上的代碼非常簡(jiǎn)單，這里就不詳加解釋了  |
|
|
