我可以使用 WrapPanel 来组织 ListView 组标题吗？答案

【问题标题】：Can I use a WrapPanel to organize ListView group headers?我可以使用 WrapPanel 来组织 ListView 组标题吗？
【发布时间】：2020-10-14 08:16:15
【问题描述】：

我希望能够使用 WrapPanel 按组标题而不是按项目进行包装。

我已经为绑定到 ObservableCollection studentlist 的 ListView 实现了以下 ICollectionView view：

        view = CollectionViewSource.GetDefaultView(studentlist);
        view.GroupDescriptions.Add(new PropertyGroupDescription("sectionoutput"));
        view.SortDescriptions.Add(new SortDescription("sectionoutput", ListSortDirection.Ascending));
        view.SortDescriptions.Add(new SortDescription("displayname", ListSortDirection.Ascending));

XAML 包含一个样式资源来设置组标头的模板：

    <Style x:Key="ContainerStyle" TargetType="{x:Type GroupItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                        <Expander Header="{Binding Name}" IsExpanded="{Binding Name, Mode=OneWay, Converter={StaticResource expanderconverter}}">
                            <ItemsPresenter />
                        </Expander>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

这个 Style 被用作 ListView 的 GroupStyle：

    <ListView ScrollViewer.HorizontalScrollBarVisibility="Disabled">            
        <ListView.GroupStyle>
            <GroupStyle ContainerStyle="{StaticResource ContainerStyle}"/>
        </ListView.GroupStyle>
...
        <ListView.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding displayname}">
                </TextBlock>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

按原样，代码显示了学生姓名的垂直列表，这些学生姓名按标题分组，列出了他们的部分编号。但我想在水平方向上按顺序列出这些组。

我知道我可以使用 WrapPanel 组织 ListView 中的项目：

        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel Orientation="Horizontal" ItemWidth="150">                        
                </WrapPanel>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

但此代码仅并排显示组中的学生，而不是并排显示组本身。我想做的是让这些组本身水平包裹。我试图在样式资源中实现一个换行面板，但我没有成功，一直想知道是否有办法按组换行。

我认为可以通过切换到 TreeView 并将组转换为项目来做到这一点。但如果可能的话，我更愿意使用 ListView，因为我的程序实现了一个将 ListView 作为参数的类。

【问题讨论】：

标签： c# wpf containers wrappanel

【解决方案1】：

GroupStyle 有一个Panel 属性，您可以将其设置为带有WrapPanel 的ItemsPanelTemplate：

<ListView.GroupStyle>
    <GroupStyle ContainerStyle="{StaticResource ContainerStyle}">
        <GroupStyle.Panel>
            <ItemsPanelTemplate>
                <WrapPanel />
            </ItemsPanelTemplate>
        </GroupStyle.Panel>
    </GroupStyle>
</ListView.GroupStyle>

【讨论】：

谢谢！我想我试过做这样的事情，但我的语法是错误的。我还是 WPF 的新手，但我真的很喜欢它的数据绑定功能。

【解决方案2】：

假设有一个 ViewModel，它是下面发布的 XAML 的 DataContext，其中包含一个名为 GroupsViewModel 的 ObservableCollection<GroupViewModel>。

GroupViewModel 仅具有一个名为 GroupName 的属性，这是要显示的组的名称，它具有 ObservableCollection<StudentViewModel> 的属性。

StudentViewModel 具有属性displayName 来显示学生的姓名。

这么说，通过使用一个Expander 和2 个嵌套的ListBox 你可以得到你想要的，就像下面的代码：

<ListBox ItemsSource="{Binding GroupsViewModel}">
<ListBox.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Expander HorizontalAlignment="Left" IsExpanded="True" Header="{Binding GroupName}">
                <ListBox ItemsSource="{Binding StudentViewModel}" HorizontalAlignment="Left">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding displayname}" />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Vertical"></StackPanel>
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>
                </ListBox>
            </Expander>
        </Grid>
    </DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <StackPanel Orientation="Horizontal"></StackPanel>
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>

【讨论】：