【windows phone】CollectionViewSource的妙用
阿新 • • 發佈:2017-11-05
.com edi mss 空間 eight mar item fontsize oba
在windows phone中綁定集合數據的時候,有時候需要分層數據,通常需要以主從試圖形式顯示。通常的方法是將第二個ListBox(主視圖)的數據源綁定到第一個ListBox
(從視圖)的SelectedItem,或者通過第一個ListBox的SelectionChanged事件來設置綁定。但是借助CollectionViewSource類可以更方便的實現;
CollectionView是一個集合視圖類,支持數據的排序、分組、過濾。對數據的映像進行排列組合;
CollectionViewSource是CollectionView的一個XAML代理,可以在XAML中使用;
案例說明:用主從試圖關系顯示兩個的員工列表;效果圖如下:
前期工作,創建三個類來初始數據源;
(1)Employee.cs
public class Employee { public int Number { get; set; } //工號 public string Name { get; set; } //姓名 public string Sex { get; set; } //性別 public int BirthYear { get; set; } //出生年份 }
(2)Department.cs
public class Department:ObservableCollection<Employee> { public string DepName { get; set; } public ObservableCollection<Employee> Employees { get; set; } }
(3)DepartmentList.cs
public class DepartmentList:ObservableCollection<Department> { public DepartmentList() { ObservableCollection<Employee> employee1 = new ObservableCollection<Employee> { new Employee{Number=2012,Name="netboy",Sex="boy",BirthYear=1992}, new Employee{Number=2013,Name="dandan",Sex="girl",BirthYear=2000}, new Employee{Number=2014,Name="xiaobai",Sex="girl",BirthYear=2012} }; ObservableCollection<Employee> employee2 = new ObservableCollection<Employee> { new Employee{Number=2020,Name="kaizi",Sex="girl",BirthYear=2011}, new Employee{Number=2021,Name="yangzai",Sex="gril",BirthYear=2010} }; this.Add(new Department { DepName = "技術部", Employees = employee1 }); this.Add(new Department { DepName = "商務部", Employees = employee2 }); //ObservableCollection<Department> deparment = new ObservableCollection<Department> //{ // new Department{DepName="tengfei",Employees=employee1}, // new Department{DepName="google",Employees=employee2} //}; } }
註意:使用ObservableCollection<T>的時候需要引用命名空間——using System.Collections.ObjectModel;
通過在新建頁面的phone:PhoneApplicationPage標記中添加一個命名空間映射。代碼如下:
xmlns:local="clr-namespace:數據綁定"//我的項目為“數據綁定”
添加資源字典:
<phone:PhoneApplicationPage.Resources> <local:DepartmentList x:Key="deplist"/> <CollectionViewSource x:Key="departmentView" Source="{StaticResource deplist}"/> <DataTemplate x:Key="dtEmployees"> <StackPanel Height="50" HorizontalAlignment="Center" Width="480" VerticalAlignment="Top" Orientation="Horizontal"> <TextBlock Height="50" HorizontalAlignment="Left" Width="90" Text="{Binding Number}"/> <TextBlock Height="50" Width="120" Text="{Binding Name}"/> <TextBlock Height="50" Width="120" Text="{Binding BirthYear}"/> <TextBlock Height="50" Width="120" Text="{Binding Sex}"/> </StackPanel> </DataTemplate> </phone:PhoneApplicationPage.Resources>
在布局頁面中添加如下代碼:
<TextBlock Width="300" Height="50" FontSize="36" Text="請選擇部門:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,30,0,0"/> <ListBox Name="lb1" Height="100" Width="156" DisplayMemberPath="DepName" ItemsSource="{Binding Source={StaticResource departmentView}}" Margin="40,86,260,0" HorizontalAlignment="Center" VerticalAlignment="Top" FontSize="32" /> <TextBlock Height="62" Width="111" HorizontalAlignment="Left" VerticalAlignment="Top" Text="{Binding Path=DepName,Source={StaticResource departmentView}}" Foreground="Red" Margin="12,210,0,0" FontSize="32" /> <TextBlock Height="50" HorizontalAlignment="Right" Text="員工列表" VerticalAlignment="Top" Margin="0,210,169,0" Width="158" FontSize="32" /> <TextBlock Height="50" HorizontalAlignment="Left" Width="120" Text="性別" Margin="344,278,0,279" FontSize="32" /> <TextBlock Height="50" Text="出生日期" Margin="204,278,112,279" FontSize="32" /> <TextBlock Height="50" Width="120" Text="工號" Margin="6,278,330,279" FontSize="32" /> <TextBlock Height="50" Width="98" Text="名字" Margin="0,278,260,279" HorizontalAlignment="Right" FontSize="32" /> <ListBox Name="lb2" Height="170" VerticalAlignment="Top" ItemsSource="{Binding Path=Employees,Source={StaticResource departmentView}}" ItemTemplate="{StaticResource dtEmployees}" Margin="12,334,-46,0" FontSize="32" />http://www.cnblogs.com/ngnetboy/archive/2012/04/12/2444659.html
【windows phone】CollectionViewSource的妙用