WPF里ItemsControl的分组实现 --listbox 实现分组

我们在用到ItemsControl时,有时会用到分组,如ListBox,ListView,DataGrid。WPF的ItemsControl可以实现分组,是依托于GroupStyle,以ListBox为例,他的分组效果图为:

  以下为前台:

 1 <ListBox Name="lbMain">
 2     <ListBox.ItemTemplate>
 3         <DataTemplate>
 4             <StackPanel Orientation="Horizontal">
 5                 <TextBlock Text="{Binding FileName}"
 6                            Width="150" />
 7                 <TextBlock Text="{Binding AuthorName}"
 8                            Width="100" />
 9                 <TextBlock Text="{Binding UpTime}"
10                            Width="100" />
11             </StackPanel>
12         </DataTemplate>
13     </ListBox.ItemTemplate>
14     <ListBox.GroupStyle>
15         <GroupStyle>
16             <GroupStyle.ContainerStyle>
17                 <Style TargetType="{x:Type GroupItem}">
18                     <Setter Property="Template">
19                         <Setter.Value>
20                             <ControlTemplate TargetType="{x:Type GroupItem}">
21                                 <Expander IsExpanded="True"
22                                           ExpandDirection="Down">
23                                     <Expander.Header>
24                                         <StackPanel Orientation="Horizontal">
25                                             <TextBlock Text="{Binding Path=Name}"
26                                                        VerticalAlignment="Center" />
27                                             <TextBlock Text="{Binding Path=ItemCount, StringFormat=数量:{0}}"
28                                                        VerticalAlignment="Center"
29                                                        Margin="5,0,0,0" />                                   
30                                             <Button Content="Sale"
31                                                     Margin="5,0,0,0" />
32                                         </StackPanel>
33                                     </Expander.Header>
34                                     <ItemsPresenter />
35                                 </Expander>
36                             </ControlTemplate>
37                         </Setter.Value>
38                     </Setter>
39                 </Style>
40             </GroupStyle.ContainerStyle>
41         </GroupStyle>
42     </ListBox.GroupStyle>
43 </ListBox>

  从16行可以看出,GroupStyle定义的是控件内部样式,所以有人尝试在这里绑实体数据属性的话肯定是失败的,注意25行只能是Name,不管分组的属性叫什么名,这都只能是Name,我写了个Button在里面,如果想知道为什么只能是Name,写个Click处理,把Button的DataContext打印出来就什么都知道了。如果想在这里做更多的处理,比如进行一些负责的运算,可以写加转换器。

  这里只是弄了一个原始的Expander装载分组控件,需要美化可以另写样式。

  以下是后台:

 1 public class ModelFile
 2 {
 3     public string FileName { get; set; }
 4     public string AuthorName { get; set; }
 5     public string UpTime { get; set; }
 6 }
 7 
 8 public partial class MainWindow : Window
 9 {
10     public ObservableCollection<ModelFile> CollectionModelFile = new ObservableCollection<ModelFile>();
11 
12     public MainWindow()
13     {
14         InitializeComponent();
15 
16         CollectionModelFile.Add(new ModelFile() { FileName = "WPF进化史", AuthorName = "王鹏", UpTime = "2014-10-10" });
17         CollectionModelFile.Add(new ModelFile() { FileName = "WPF概论", AuthorName = "大飞", UpTime = "2014-10-10" });
18         CollectionModelFile.Add(new ModelFile() { FileName = "WPF之美", AuthorName = "小虫", UpTime = "2014-10-11" });
19         CollectionModelFile.Add(new ModelFile() { FileName = "WPF之道", AuthorName = "青草", UpTime = "2014-11-11" });
20         CollectionModelFile.Add(new ModelFile() { FileName = "WPF之禅", AuthorName = "得瑟鬼", UpTime = "2014-11-11" });
21         CollectionModelFile.Add(new ModelFile() { FileName = "WPF入门", AuthorName = "今晚吃什么", UpTime = "2014-11-11" });
22         CollectionModelFile.Add(new ModelFile() { FileName = "WPF神技", AuthorName = "无间道王二", UpTime = "2014-12-12" });
23         CollectionModelFile.Add(new ModelFile() { FileName = "WPF不为人知之密", AuthorName = "星期八", UpTime = "2014-12-12" });
24         CollectionModelFile.Add(new ModelFile() { FileName = "WPF之革命", AuthorName = "两把刀", UpTime = "2014-12-12" });
25 
26         lbMain.ItemsSource = CollectionModelFile;
27 
28         ICollectionView cv = CollectionViewSource.GetDefaultView(lbMain.ItemsSource);
29         cv.GroupDescriptions.Add(new PropertyGroupDescription("UpTime"));
30     }
31 }

  重点是28、29行,有了这两句,ListBox就能准确得分组显示了,其他ItemsControl的分组类同。

  至此一个简单的ListBox分组显示就完成了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏菩提树下的杨过

Flash在线拍摄用户头象

很多网站在上传用户头象时,除了传统方式上传外,都支持在线摄像头拍照并做简单编辑,完成之后再将图象数据提交到服务端(比如ASP.Net),这几天正好需要这个功能,...

36780
来自专栏叁金大数据

WPF播放器

最近由于工作需要,需要做一个播放软件,在网上参考了很多例子,园子里有很多代码。其中最多的就是wpf自带的MediaElement控件,或者VLC视频播放器。

42420
来自专栏菩提树下的杨过

.NET:Entity Framework 笔记

有二年没关注EF,今天无意试了下发现跟主流的Hibernate等ORM框架越来越接近了,先看下Entity类的定义: using System; using S...

22680
来自专栏机器学习从入门到成神

Spring与MyBatis的整合

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/sinat_35512245/articl...

2.7K20
来自专栏Jerry的SAP技术分享

如何在SAP CRM里创建和消费Web service

The following steps demonstrates how to expose a function module as a web servic...

14410
来自专栏菩提树下的杨过

ExtJs+WCF+LINQ实现分页Grid

上篇文章《用ExtJs+Linq+Wcf打造简单grid 》,这个网格控件不带分页,本文在上文的基础上添加分页功能,文中会着重介绍如何在用LINQ返回分页数据,...

38670
来自专栏五毛程序员

五毛的cocos2d-x学习笔记08-动画

20850
来自专栏james大数据架构

Excel导入导出数据库02

excel导入时还要保存字体、其背景颜色等信息时读取方法就要改变: 1 using System; 2 using System.Collections...

21090
来自专栏

Flex 上传文件,服务端.net

using System; using System.Data; using System.Configuration; using System.Collec...

8210
来自专栏更流畅、简洁的软件开发方式

【开源】QuickPager ASP.NET2.0分页控件V2.0.0.1——分页控件的源码(一) 主体

namespace JYK.Controls {     /**//// <summary>     /// 分页控件     /// PageGetData....

19370

扫码关注云+社区

领取腾讯云代金券