ListBox分组WPF

Question

我正在尝试对列表框进行分组。而我所能得到的只是标题。

我已经获得了“在线用户”列表。 ，看起来像这样。

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'customTitleCase'
})
export class CustomTitleCasePipe implements PipeTransform {


  transform(value: string, args?: any): any {
    if (!value) return null;

    let words = value.split(" ");
    for (var index = 0; index < words.length; index++) {
      var word = words[index];
      if (index > 0 && this.isPreposition(word)) {
        words[index] = word.toLowerCase();
      }
      else {
        words[index] = this.toTitleCase(word);
      }
    }
    return words.join(" ");

  }

  private toTitleCase(word: string): string {
    return word.substr(0, 1).toUpperCase() + word.substr(1).toLowerCase();
  }

  private isPreposition(word: string): boolean {
    let lowerCaseWords = ["a","an","of", "the"]; // add more words to exclude here

    return lowerCaseWords.includes(word.toLowerCase());

  }

}

然后我用一些用户填充列表，并将该列表放入ICollectionView＆＃39; FilterableOnlineUsers＆＃39;

public class OnlineUser{
  public string Branch {get;set;}
  public string FirstName{get;set;}
  public string LastName{get;set;}
}

在我的Xaml中：

FilterableOnlineUsers = CollectionViewSource.GetDefaultView(OnlineUsers);
FilterableOnlineUsers.GroupDescriptions.Add(new PropertyGroupDescription("Branch"));
FilterableOnlineUsers.SortDescriptions.Add(new SortDescription("Branch", ListSortDirection.Descending));

我可以在列表框中显示的是分支名称。我无法在名称组描述中显示名字或姓氏。

感谢。

Answer 1

您应该在CollectionViewSource资源中定义XAML，如下所示，并将ItemsSource设置为CollectionViewSource，

<CollectionViewSource x:Key="ListBoxItems" Source="{Binding Path=ListOfOnlineUser}">
        <CollectionViewSource.GroupDescriptions>
            <PropertyGroupDescription PropertyName="Branch" />
        </CollectionViewSource.GroupDescriptions>
</CollectionViewSource>

在列表框中

 <ListBox ItemsSource="{Binding Source={StaticResource ListBoxItems}}"/>

<强>详细 下面是ListBox显示分组分支，每个分支都在扩展器内，您可以折叠并展开每个组。

    <ListBox
        Margin="0,0,5,0"
        ItemsSource="{Binding Source={StaticResource ListBoxItems}}"
        SelectedIndex="-1"
        SelectedItem="{Binding SelectedBranch}">            
        <ListBox.GroupStyle>
            <GroupStyle>
                <GroupStyle.Panel>
                    <ItemsPanelTemplate>
                        <VirtualizingStackPanel Orientation="Vertical" />
                    </ItemsPanelTemplate>
                </GroupStyle.Panel>
                <GroupStyle.ContainerStyle>
                    <Style TargetType="{x:Type GroupItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate>
                                    <Expander
                                        Padding="0"                                           
                                        BorderThickness="0"
                                        Header="{Binding Name}"
                                        IsExpanded="True">
                                        <ItemsPresenter/>
                                    </Expander>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </GroupStyle.ContainerStyle>
            </GroupStyle>
        </ListBox.GroupStyle>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Border BorderThickness="0">
                    <Grid>                            
                        <StackPanel Orientation="Horizontal">                               
                            <TextBlock Text="{Binding FirstName}" />
                            <TextBlock Text="{Binding LastName}" />
                        </StackPanel>                            
                    </Grid>
                </Border>
            </DataTemplate>
        </ListBox.ItemTemplate>
        <ListBox.ItemContainerStyle>
            <Style TargetType="{x:Type ListBoxItem}">
                <Setter Property="Padding" Value="0" />
                <Setter Property="Margin" Value="0" />
            </Style>
        </ListBox.ItemContainerStyle>
    </ListBox>