WPF TreeView 绑定不同对象的使用方法

关键在于 HierarchicalDataTemplate模板的使用

先看效果

xaml界面

 1 <Window
 2     x:Class="Xml数据展示.MainWindow"
 3     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 4     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 5     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 6     xmlns:local="clr-namespace:Xml数据展示"
 7     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 8     Title="MainWindow"
 9     Width="800"
10     Height="450"
11     mc:Ignorable="d">
12     <Window.Resources>
13         <XmlDataProvider
14             x:Key="xml"
15             Source="./DataContent.xml"
16             XPath="/Company/Client" />
17         <local:XmlConverter x:Key="XmlConverter" />
18     </Window.Resources>
19     <Grid>
20         <Grid.ColumnDefinitions>
21             <ColumnDefinition Width="3*" />
22             <ColumnDefinition Width="8*" />
23         </Grid.ColumnDefinitions>
24         <TreeView x:Name="tree">
25             <TreeView.Resources>
26                 <!--层级控件模板,有多少个子节点类型,就对应多少个模板-->
27                 <!--  Brands类型的控件模板  -->
28                 <HierarchicalDataTemplate DataType="{x:Type local:Country}" ItemsSource="{Binding Path=Brands}">
29                     <StackPanel Orientation="Horizontal">
30                         <Rectangle Width="30" Height="15">
31                             <Rectangle.Fill>
32                                 <ImageBrush ImageSource="{Binding Flag}" />
33                             </Rectangle.Fill>
34                         </Rectangle>
35                         <TextBlock Margin="5,0" Text="{Binding Name}" />
36                     </StackPanel>
37                 </HierarchicalDataTemplate>
38                 <!--  Car类型的控件模板  -->
39                 <HierarchicalDataTemplate DataType="{x:Type local:Brand}" ItemsSource="{Binding Cars}">
40                     <StackPanel Orientation="Horizontal">
41                         <Rectangle Width="30" Height="15">
42                             <Rectangle.Fill>
43                                 <ImageBrush ImageSource="{Binding Icon}" />
44                             </Rectangle.Fill>
45                         </Rectangle>
46                         <TextBlock Text="{Binding Name}" />
47                     </StackPanel>
48                 </HierarchicalDataTemplate>
49                 <HierarchicalDataTemplate DataType="{x:Type local:Car}">
50                     <TextBlock Text="{Binding Name}" />
51                 </HierarchicalDataTemplate>
52             </TreeView.Resources>
53             <TreeViewItem x:Name="item" Header="汽车信息" />
54         </TreeView>
55         <Grid Margin="5" Grid.Column="1" DataContext="{Binding Path=SelectedItem, ElementName=tree, Converter={local:CarConverter}}">
56             <Grid.RowDefinitions>
57                 <RowDefinition Height="8*" />
58                 <RowDefinition Height="2*" />
59             </Grid.RowDefinitions>
60             <Viewbox Grid.Row="0">
61                 <Image Source="{Binding Image}" Stretch="Fill" />
62             </Viewbox>
63             <StackPanel  Grid.Row="1" Orientation="Horizontal">
64                 <StackPanel Width="100" Orientation="Horizontal">
65                     <TextBlock Text="名字:" />
66                     <TextBlock Text="{Binding Name}" />
67                 </StackPanel>
68                 <StackPanel Width="100" Orientation="Horizontal">
69                     <TextBlock Text="颜色:" />
70                     <TextBlock Text="{Binding Color}" />
71                 </StackPanel>
72                 <StackPanel Width="100" Orientation="Horizontal">
73                     <TextBlock Text="速度:" />
74                     <TextBlock Text="{Binding Speed}" />
75                 </StackPanel>
76                 <StackPanel Width="100" Orientation="Horizontal">
77                     <TextBlock Text="出厂日期:" />
78                     <TextBlock Text="{Binding Pubdate}" />
79                 </StackPanel>
80             </StackPanel>
81         </Grid>
82     </Grid>
83 </Window>

后台

  1 using System;
  2 using System.Collections.Generic;
  3 using System.Globalization;
  4 using System.Windows;
  5 using System.Windows.Controls;
  6 using System.Windows.Data;
  7 using System.Windows.Markup;
  8 
  9 namespace Xml数据展示
 10 {
 11     public class Brand
 12     {
 13         public List<Car> Cars { get; set; }
 14 
 15         public Uri Icon { get; set; }
 16 
 17         public string Name { get; set; }
 18     }
 19 
 20     public class Car
 21     {
 22         public string Color { get; set; }
 23 
 24         public Uri Image { get; set; }
 25 
 26         public string Name { get; set; }
 27 
 28         public DateTime Pubdate { get; set; }
 29 
 30         public double Speed { get; set; }
 31     }
 32 
 33     /// <summary>
 34     /// 标记扩展
 35     /// </summary>
 36     public class CarConverter : MarkupExtension, IValueConverter
 37     {
 38         public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
 39         {
 40             if (value is Country || value is Brand)
 41             {
 42                 return new Car()
 43                 {
 44                     Name = "",
 45                     Color = "",
 46                     Image = new Uri("Assets/空白.jpeg", UriKind.Relative),
 47                     Speed = 0,
 48                     Pubdate = DateTime.Today,
 49                 };
 50             }
 51             var car = value as Car;
 52             return car;
 53         }
 54 
 55         public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
 56         {
 57             throw new NotImplementedException();
 58         }
 59 
 60         public override object ProvideValue(IServiceProvider serviceProvider)
 61         {
 62             return this;
 63         }
 64     }
 65 
 66     public class CarInfo
 67     {
 68         public List<Country> Countries { get; set; }
 69 
 70         public CarInfo()
 71         {
 72             Countries = new List<Country>()
 73             {
 74                 new Country()
 75                 {
 76                     Name="中国",
 77                     Flag=new Uri("Assets/国旗/中国国旗.png",UriKind.Relative),
 78                     Brands=new List<Brand>()
 79                     {
 80                         new Brand()
 81                         {
 82                             Name="北汽",
 83                             Icon=new Uri("Assets/品牌/北汽.png",UriKind.Relative),
 84                             Cars=new List<Car>()
 85                             {
 86                                 new Car()
 87                                 {
 88                                     Name="EV160",
 89                                     Color="白色",
 90                                     Speed=80,
 91                                     Pubdate=new DateTime(2016,10,10),
 92                                     Image=new Uri("/Assets/汽车/北汽.jpeg",UriKind.Relative)
 93                                 },
 94                             }
 95                         },
 96                         new Brand()
 97                         {
 98                             Name="蔚来",
 99                             Icon=new Uri("Assets/品牌/蔚来.png",UriKind.Relative),
100                             Cars=new List<Car>()
101                             {
102                                 new Car()
103                                 {
104                                     Name="SDA",
105                                     Color="",
106                                     Speed=80,
107                                     Pubdate=new DateTime(2016,10,10),
108                                     Image=new Uri("Assets/汽车/蔚来.jpeg",UriKind.Relative)
109                                 },
110                             }
111                         },
112                         new Brand()
113                         {
114                             Name="比亚迪",
115                             Icon=new Uri("Assets/品牌/比亚迪.png",UriKind.Relative),
116                             Cars=new List<Car>()
117                             {
118                                 new Car()
119                                 {
120                                     Name="MMG",
121                                     Color="白色",
122                                     Speed=80,
123                                     Pubdate=new DateTime(2016,10,10),
124                                     Image=new Uri("Assets/汽车/比亚迪.jpeg",UriKind.Relative)
125                                 },
126                             }
127                         }
128                     }
129                 },
130                 new Country()
131                 {
132                     Name="德国",
133                     Flag=new Uri("Assets/国旗/德国国旗.png",UriKind.Relative),
134                     Brands=new List<Brand>()
135                     {
136                         new Brand()
137                         {
138                             Name="奔驰",
139                             Icon=new Uri("Assets/品牌/奔驰.png",UriKind.Relative),
140                             Cars=new List<Car>()
141                             {
142                                 new Car()
143                                 {
144                                     Name="EV160",
145                                     Color="白色",
146                                     Speed=80,
147                                     Pubdate=new DateTime(2016,10,10),
148                                     Image=new Uri("/Assets/汽车/奔驰.jpeg",UriKind.Relative)
149                                 },
150                             }
151                         },
152                         new Brand()
153                         {
154                             Name="宝马",
155                             Icon=new Uri("Assets/品牌/宝马.png",UriKind.Relative),
156                             Cars=new List<Car>()
157                             {
158                                 new Car()
159                                 {
160                                     Name="SDA",
161                                     Color="",
162                                     Speed=80,
163                                     Pubdate=new DateTime(2016,10,10),
164                                     Image=new Uri("Assets/汽车/宝马.jpeg",UriKind.Relative)
165                                 },
166                             }
167                         },
168                     }
169                 },
170                 new Country()
171                 {
172                     Name="日本",
173                     Flag=new Uri("Assets/国旗/日本国旗.png",UriKind.Relative),
174                     Brands=new List<Brand>()
175                     {
176                         new Brand()
177                         {
178                             Name="本田",
179                             Icon=new Uri("Assets/品牌/本田.png",UriKind.Relative),
180                             Cars=new List<Car>()
181                             {
182                                 new Car()
183                                 {
184                                     Name="EV160",
185                                     Color="白色",
186                                     Speed=80,
187                                     Pubdate=new DateTime(2016,10,10),
188                                     Image=new Uri("/Assets/汽车/本田.jpeg",UriKind.Relative)
189                                 },
190                             }
191                         },
192                         new Brand()
193                         {
194                             Name="丰田",
195                             Icon=new Uri("Assets/品牌/丰田.png",UriKind.Relative),
196                             Cars=new List<Car>()
197                             {
198                                 new Car()
199                                 {
200                                     Name="SDA",
201                                     Color="",
202                                     Speed=80,
203                                     Pubdate=new DateTime(2016,10,10),
204                                     Image=new Uri("Assets/汽车/丰田.jpeg",UriKind.Relative)
205                                 },
206                             }
207                         },
208                     }
209                 }
210             };
211         }
212     }
213 
214     public class Country
215     {
216         public List<Brand> Brands { get; set; }
217 
218         public Uri Flag { get; set; }
219 
220         public string Name { get; set; }
221     }
222 
223     /// <summary>
224     /// MainWindow.xaml 的交互逻辑
225     /// </summary>
226     public partial class MainWindow : Window
227     {
228         public MainWindow()
229         {
230             InitializeComponent();
231             var info = new CarInfo();
232             item.ItemsSource = info.Countries;
233         }
234     }
235 }

 

 

posted @ 2021-10-26 17:38  只吃肉不喝酒  阅读(600)  评论(0编辑  收藏  举报