WPF中TreeView的使用
WPF中TreeView的使用
一、最简单的用法，使用TreeViewItem展开，如下：
<Window x:Class="WpfApp2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp2"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<TreeView FontSize="16">
<TreeViewItem Header="动物">
<TreeViewItem Header="猴子"></TreeViewItem>
<TreeViewItem Header="老虎"></TreeViewItem>
<TreeViewItem Header="大象"></TreeViewItem>
</TreeViewItem>
<TreeViewItem Header="水果">
<TreeViewItem Header="苹果"></TreeViewItem>
<TreeViewItem Header="橘子"></TreeViewItem>
<TreeViewItem Header="葡萄"></TreeViewItem>
</TreeViewItem>
<TreeViewItem Header="蔬菜">
<TreeViewItem Header="青菜"></TreeViewItem>
<TreeViewItem Header="白菜"></TreeViewItem>
<TreeViewItem Header="茄子"></TreeViewItem>
</TreeViewItem>
</TreeView>
</Grid>
</Window>
效果：
二、获取xml文件中的数据进行展示，如下：
xml文件XMLFile1.xml代码：
<?xml version="1.0" encoding="utf-8" ?>
<Data xmlns="">
<Grade Name="一年级">
<Class Name="1班">
<Group Name="A组"/>
<Group Name="B组"/>
<Group Name="C组"/>
<Group Name="D组"/>
</Class>
</Grade>
<Grade Name="二年级">
<Class Name="1班">
<Group Name="A组"/>
<Group Name="B组"/>
<Group Name="C组"/>
<Group Name="D组"/>
</Class>
</Grade>
<Grade Name="三年级">
<Class Name="1班">
<Group Name="A组"/>
<Group Name="B组"/>
<Group Name="C组"/>
<Group Name="D组"/>
</Class>
</Grade>
</Data>
窗体xaml代码：
<Window x:Class="WpfApp1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<!--数据源-->
<XmlDataProvider x:Key="ds" Source="XMLFile1.xml" XPath="Data/Grade"/>
<!--年级模板-->
<HierarchicalDataTemplate DataType="Grade" ItemsSource="{Binding XPath=Class}">
<TextBlock Text="{Binding XPath=@Name}"></TextBlock>
</HierarchicalDataTemplate>
<!--班级模板-->
<HierarchicalDataTemplate DataType="Class" ItemsSource="{Binding XPath=Group}">
<RadioButton Content="{Binding XPath=@Name}" GroupName="gn"></RadioButton>
</HierarchicalDataTemplate>
<!--小组模板-->
<HierarchicalDataTemplate DataType="Group" ItemsSource="{Binding XPath=Student}">
<CheckBox Content="{Binding XPath=@Name}"></CheckBox>
</HierarchicalDataTemplate>
</Window.Resources>
<Grid>
<TreeView ItemsSource="{Binding Source={StaticResource ds}}"></TreeView>
</Grid>
</Window>
运行效果：
三、使用数据绑定来来展示节点，这里在一个程序中，用三个函数举了三个例子，如下：
首先新建一个PropertyNodeItem类：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace WPFTreeview
{
class PropertyNodeItem
{
public string Icon { get; set; }
public string EditIcon { get; set; }
public string DisplayName { get; set; }
public string Name { get; set; }
public List<PropertyNodeItem> Children { get; set; }
public PropertyNodeItem()
{
Children = new List<PropertyNodeItem>();
}
}
}
主窗体xaml代码：
<Window x:Class="WPFTreeview.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WPFTreeview"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<TreeView x:Name="treeView" FontSize="16">
<TreeView.ItemTemplate>
<HierarchicalDataTemplate DataType="{x:Type local:PropertyNodeItem}" ItemsSource="{Binding Path=Children}">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Icon}" Width="20"/>
<TextBlock Text="{Binding DisplayName}"/>
<Image Source="{Binding EditIcon}" Width="20"/>
<StackPanel.ToolTip>
<TextBlock Text="{Binding Name}"/>
</StackPanel.ToolTip>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
</Grid>
</Window>
主窗体后台代码：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Xml;
namespace WPFTreeview
{
/// 三个例子运行效果分别是：
其中第三个例子是从XML文件中读取的数据，XMLProducts.xml文件代码如下：
<?xml version="1.0" encoding="utf-8" ?>
<Products>
<Node1 Name="董事长">
<Node2 Name="经理A">
<Node3 Name="主任1"></Node3>
<Node3 Name="主任2"></Node3>
<Node3 Name="主任3"></Node3>
</Node2>
<Node2 Name="经理B">
<Node3 Name="主任1"></Node3>
<Node3 Name="主任2"></Node3>
<Node3 Name="主任3"></Node3>
</Node2>
<Node2 Name="经理C">
<Node3 Name="主任1"></Node3>
<Node3 Name="主任2"></Node3>
<Node3 Name="主任3"></Node3>
</Node2>
</Node1>
<Node1 Name="处长">
<Node2 Name="科长A">
<Node3 Name="科员1"></Node3>
<Node3 Name="科员2"></Node3>
<Node3 Name="科员3"></Node3>
</Node2>
<Node2 Name="科长B">
<Node3 Name="科员1"></Node3>
<Node3 Name="科员2"></Node3>
<Node3 Name="科员3"></Node3>
</Node2>
<Node2 Name="科长C">
<Node3 Name="科员1"></Node3>
<Node3 Name="科员2"></Node3>
<Node3 Name="科员3"></Node3>
</Node2>
</Node1>
<Node1 Name="班长">
<Node2 Name="组长A">
<Node3 Name="学生1"></Node3>
<Node3 Name="学生2"></Node3>
<Node3 Name="学生3"></Node3>
</Node2>
<Node2 Name="组长B">
<Node3 Name="学生1"></Node3>
<Node3 Name="学生2"></Node3>
<Node3 Name="学生3"></Node3>
</Node2>
<Node2 Name="组长C">
<Node3 Name="学生1"></Node3>
<Node3 Name="学生2"></Node3>
<Node3 Name="学生3"></Node3>
</Node2>
</Node1>
</Products>
XML文件属性如下：
