1. 程式人生 > >WPF ListView 分組 Grouping

WPF ListView 分組 Grouping

containe card mage dock mod route head nts row

在Resource裏定義數據源和分組字段:

<CollectionViewSource x:Key="listData" Source="{Binding CategoryItemsView}">
            <CollectionViewSource.GroupDescriptions>
                <PropertyGroupDescription PropertyName="CategoryType"></PropertyGroupDescription>
            </CollectionViewSource.GroupDescriptions
> </CollectionViewSource>

分組字段也可以在Loaded事件中用代碼定義:

        private void FileManageCard_Loaded(object sender, RoutedEventArgs e)
        {
            CollectionView view = (CollectionView)CollectionViewSource.GetDefaultView(lvItemsCategory.ItemsSource);
            PropertyGroupDescription groupDescription 
= new PropertyGroupDescription("CategoryType"); view.GroupDescriptions.Add(groupDescription); }

然後

<ListView Grid.Row="0"
                        x:Name="lvItemsCategory"
                        ItemsSource="{Binding Source={StaticResource listData}}"
                        Style
="{StaticResource FileManagerListViewStyle}" ItemContainerStyle="{StaticResource FileManagerListViewItemStyle}" SelectionMode="Single"> <ListView.GroupStyle> <GroupStyle> <GroupStyle.HeaderTemplate> <DataTemplate> <StackPanel Orientation="Horizontal" Background="Transparent" Height="35"> <TextBlock Text="{Binding Name}" FontSize="18" FontWeight="Bold" Foreground="Gray"/> </StackPanel> </DataTemplate> </GroupStyle.HeaderTemplate> </GroupStyle> </ListView.GroupStyle> </ListView>

最後附上Style和ItemContainerStyle:

    <Style x: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>
                <ControlTemplate TargetType="{x:Type ListView}">
                    <ScrollViewer VerticalScrollBarVisibility="Hidden" HorizontalAlignment="Stretch">
                        <ItemsPresenter/>
                    </ScrollViewer>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="FileManagerListViewItemStyle" TargetType="{x:Type ListViewItem}">
        <Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
        <Setter Property="Cursor" Value="Hand"></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListViewItem}">
                    <Border x:Name="back" Background="Transparent" Margin="0,0,0,0" Height="25">
                        <Grid Margin="20,0,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="30"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Image  Grid.Column="0"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                Width="20"
                                Height="20"
                                Source="{Binding Icon,Converter={StaticResource ImgPathToImageConverter}}"/>
                            <DockPanel Grid.Column="1">
                                <TextBlock Text="{Binding DisplayName}"
                                    Height="25"
                                    Foreground="#FF6D6D6D"
                                    FontSize="16"/>
                                <TextBlock Text="{Binding Count,StringFormat=‘ ({0})‘}"
                                    Foreground="#FF6D6D6D"
                                    FontSize="16"></TextBlock>
                            </DockPanel>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="back" Property="Background" Value="LightGray"></Setter>
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="back" Property="Background" Value="Black"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

WPF ListView 分組 Grouping