实现效果:
当选中复选框时, ItemsControl 的内容将按 Type 特性进行分组。
实践:
- GroupStyle、ItemContainerStyle使用
- CollectionView、CollectionViewSource使用
- PropertyGroupDescription使用
代码:
xaml:
- 数据模板内的资源设置TextBlock字体,排列方向
- 模板内各text绑定xml数据
- ItemContainerStyle子项容器样式设置
- GroupStyle组样式设置及分组头目标设置
<ItemsControl Margin="10" Name="myItemsControl"
ItemsSource="{Binding Source={StaticResource MyTasks}}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<DataTemplate.Resources>
<Style TargetType="TextBlock">
<Setter Property="FontSize" Value="18"/>
<Setter Property="HorizontalAlignment" Value="Center"/>
</Style>
</DataTemplate.Resources>
<Grid>
<Ellipse Fill="Silver"/>
<StackPanel>
<TextBlock Margin="3,8,3,0"
Text="{Binding XPath=@Name}"/>
<TextBlock Margin="3,0,3,7"
Text="{Binding XPath=@Priority}" />
</StackPanel>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="Control.Width" Value="100"/>
<Setter Property="Control.Margin" Value="5"/>
<!--<Setter Property="Control.Height" Value="100"/>-->
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock FontWeight="Bold" FontSize="15"
Text="{Binding Path=Name}"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</ItemsControl.GroupStyle>
</ItemsControl>
ps:每组的类型均为 CollectionViewGroup。 指定了 GroupStyle HeaderTemplate,以便它显示为一个 TextBlock,其中显示了每个组HeaderTemplate的 Name。 在本例中, Text="{Binding Path=Name}"中的Name 为实际表现为 Work 或 Home,而非xml的XPath=@Name。
以下后台按分组样式显示:
- 获取绑定源的默认视图,转换为集合视图
- 实例一个属性分组描述PropertyGroupDescription
- 添加进入集合视图的属性分组描述集合中-myView.GroupDescriptions.Add(groupDescription)
private void AddGrouping(object sender, RoutedEventArgs e)
{
_myView = (CollectionView) CollectionViewSource.GetDefaultView(myItemsControl.ItemsSource);
if (_myView.CanGroup)
{
var groupDescription
= new PropertyGroupDescription("@Type");
_myView.GroupDescriptions.Add(groupDescription);
}
}
取消分组显示
- 集合视图的_myView.GroupDescriptions.Clear()
private void RemoveGrouping(object sender, RoutedEventArgs e)
{
_myView = (CollectionView) CollectionViewSource.GetDefaultView(myItemsControl.ItemsSource);
_myView.GroupDescriptions.Clear();
}
扩展:
- 不应在代码中创建CollectionViewSource此类的对象。若要为只实现 IEnumerable 的集合创建集合视图,请创建 CollectionViewSource 对象,将集合添加到 Source 属性,然后从 View 属性获取集合视图。
- 可以将集合视图视为位于绑定源集合之上的一个层,您可以通过它使用排序、筛选和分组查询来导航和显示集合,所有这些操作都无需操作基础源集合本身。
- 需要CollectionViewSource.GetDefaultView来获取默认视图,CollectionView无此方法
- PropertyGroupDescription 允许您根据 PropertyName 创建隐式组。 如果您只想按属性进行分组,可以设置 PropertyName 属性。 如果您要更改最终用于组的值,可以使用 Converter 属性提供值转换器。
- 例如,您可能要根据名称的第一个字母对项进行分组。 如果 PropertyName 属性尚未设置,则项本身会传递到值转换器。 转换器可能返回集合,即指示项可能出现在多个组中。您也可以使用 StringComparison 属性定义如何进行字符串比较。
ps:
- 根据 CollectionView 的内部类是仅实现 IEnumerable的集合的默认值视图。 ListCollectionView 是实现 IList 的集合的默认视图。 BindingListCollectionView 是实现 IBindingListView 或 IBindingList 的集合的默认视图。
- 若要在 XAML 中设置视图,请使用 CollectionViewSource 类。 CollectionViewSource 是 CollectionView 类的 XAML 表示形式,而且它公开了最常用的 CollectionView 类的成员。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。