WPF：分类的可收缩的WrapPanel列表

Mgen

<div class="postcontent"><div id="cnblogs_post_body">效果如下，WrapPanel样式的列表同时支持分类。
  
   
  如果点击分类列表Header后，相应的类别子元素会收缩。
  
   
   
  起初想用ListBox实现，但是很快被WrapPanel和GroupStyle整的一头雾水。同时对WPF中数据源ICollectionView的分类是采用PropertyGroupDescription这种靠反射来执行的逻辑表示不爽，最终定自己写一个类似的控件。
   
  
  核心类型WrapList继承自WrapPanel。
  三个非常基础的WPF常见控件/数据样式选项：HeaderStyle，HeaderTemplate和ItemTemplate分别设置类型Header的Style和Data Template，以及子元素的Data Template。
  同时还有一个WrapListGroupHeader控件代表类型Header的显示控件，它就是一个ToggleButton，在点击后会自动收缩其子项目。
   
  ItemsSource类型是object，但是它只支持IEnumerable<IGrouping<TKey, TElement>>类型，没有使用WPF中ICollectionView的PropertyGroupDescription，而是LINQ中GroupBy返回的原生结果。当ItemsSource被设置后，元素即会被显示。
   
  那么数据源的设置的示例代码：
  <div style="border-bottom: gray 1px solid; border-left: gray 1px solid; padding-bottom: 10px; background-color: #262626; margin: 12px; padding-left: 10px; padding-right: 10px; border-top: gray 1px solid; border-right: gray 1px solid; padding-top: 10px" class="mgen_code">   //mylist是WrapList控件的名称
    //设置WrapList的数据源为1-50余3的结果
    var groups = Enumerable.Range(1, 50).GroupBy(i => i % 3);
    mylist.ItemsSource = groups;