Define data sources and grouping fields in resource:
<CollectionViewSourcex:key= "ListData"Source="{Binding Categoryitemsview}"> <collectionviewsource.groupdescriptions> <propertygroupdescriptionPropertyName= "CategoryType"></propertygroupdescription> </collectionviewsource.groupdescriptions> </CollectionViewSource>
The grouping field can also be defined in code in the loaded event:
Private void Filemanagecard_loaded (object sender, RoutedEventArgs e) { = (CollectionView) Collectionviewsource.getdefaultview (Lvitemscategory.itemssource); New Propertygroupdescription ("categorytype"); View. Groupdescriptions.add (groupdescription); }
And then
<ListViewGrid.Row= "0"x:name= "Lvitemscategory"ItemsSource="{Binding Source={staticresource listData}}"Style="{StaticResource Filemanagerlistviewstyle}"Itemcontainerstyle="{StaticResource Filemanagerlistviewitemstyle}"SelectionMode= "single"> <Listview.groupstyle> <GroupStyle> <groupstyle.headertemplate> <DataTemplate> <StackPanelOrientation= "Horizontal"Background= "Transparent"Height= "+"> <TextBlockText="{Binding Name}"FontSize= "+"FontWeight= "Bold"Foreground= "Gray"/> </StackPanel> </DataTemplate> </groupstyle.headertemplate> </GroupStyle> </Listview.groupstyle> </ListView>
Finally attach style and Itemcontainerstyle:
<Stylex:key= "Filemanagerlistviewstyle"TargetType="{x:type ListView}"> <Setter Property= "VerticalAlignment"Value= "Top"></Setter> <Setter Property= "HorizontalAlignment"Value= "Stretch"></Setter> <Setter Property= "AllowDrop"Value="{Binding Isallowdrop}"></Setter> <Setter Property= "Template"> <Setter.value> <ControlTemplateTargetType="{x:type ListView}"> <ScrollViewerverticalscrollbarvisibility= "Hidden"HorizontalAlignment= "Stretch"> <Itemspresenter/> </ScrollViewer> </ControlTemplate> </Setter.value> </Setter> </Style> <Stylex:key= "Filemanagerlistviewitemstyle"TargetType="{x:type ListViewItem}"> <Setter Property= "HorizontalAlignment"Value= "Stretch"></Setter> <Setter Property= "Cursor"Value= "Hand"></Setter> <Setter Property= "Template"> <Setter.value> <ControlTemplateTargetType="{x:type ListViewItem}"> <Borderx:name= "Back"Background= "Transparent"Margin= "0,0,0,0"Height= "+"> <GridMargin= "20,0,0,0"> <grid.columndefinitions> <ColumnDefinitionWidth= "+"/> <ColumnDefinitionWidth="*"/> </grid.columndefinitions> <ImageGrid.column= "0"HorizontalAlignment= "Center"VerticalAlignment= "Center"Width= " the"Height= " the"Source="{Binding Icon,converter={staticresource imgpathtoimageconverter}}"/> <DockPanelGrid.column= "1"> <TextBlockText="{Binding DisplayName}"Height= "+"Foreground= "#FF6D6D6D"FontSize= "+"/> <TextBlockText="{Binding count,stringformat= ' ({0}) '}"Foreground= "#FF6D6D6D"FontSize= "+"></TextBlock> </DockPanel> </Grid> </Border> <controltemplate.triggers> <Trigger Property= "IsMouseOver"Value= "True"> <SetterTargetName= "Back" Property= "Background"Value= "Lightgray"></Setter> </Trigger> <Trigger Property= "IsSelected"Value= "True"> <SetterTargetName= "Back" Property= "Background"Value= "Black"></Setter> </Trigger> </controltemplate.triggers> </ControlTemplate> </Setter.value> </Setter> </Style>
WPF ListView Grouping Grouping