有没有办法做 ListViewHeaderItem 完全做的事情？

编程问答 2022-05-29

问题描述

我想实现一个像 ListView 一样的自定义视图。

现在的问题是我想从组标题中获取一个 Tapped 事件，也许更多。
它始终将 GroupItem 创建为组视图，并且无法更改。

我发现ListView所做的是系统创建ListViewHeaderItem并在实现GroupStyle.HeaderTemplate时添加到可视化树中。 我的问题是有什么方法可以做到这一点？

CS：

public class CustomView : ItemsControl

xml:

<CollectionViewSource x:Name="itemCVS" IsSourceGrouped="True" 
               Source="{x:Bind Groups}" ItemsPath="Items"/>
...
<CustomView ItemsSource="{x:Bind itemCVS.View}">
  <CustomView.GroupStyle>
    <GroupStyle.HeaderTemplate>
      <DataTemplate>
        <TextBlock Text="{Binding}"/>
      </DataTemplate>
    </GroupStyle.HeaderTemplate>
    <GroupStyle.Panel>
      <ItemsPanelTemplate>
        <CustomPanel/>
      </ItemsPanelTemplate>
    </GroupStyle.Panel>
  </CustomView.GroupStyle>
</CustomView>

CustomView 可视化树：

CustomView
 Windows.UI.Xaml.Controls.Border
  Windows.UI.Xaml.Controls.ScrollViewer
   Windows.UI.Xaml.Controls.Border
    Windows.UI.Xaml.Controls.Grid
     Windows.UI.Xaml.Controls.ScrollContentPresenter
      Windows.UI.Xaml.Controls.ItemsPresenter
       Windows.UI.Xaml.Controls.ContentControl
       CustomPanel
        Windows.UI.Xaml.Controls.GroupItem
         Windows.UI.Xaml.Controls.Grid
          Windows.UI.Xaml.Controls.ContentControl
           Windows.UI.Xaml.Controls.ContentPresenter
            Windows.UI.Xaml.Controls.TextBlock
          Windows.UI.Xaml.Controls.ItemsControl
           Windows.UI.Xaml.Controls.ItemsPresenter
            Windows.UI.Xaml.Controls.ContentControl
            CustomPanel
             Item 1
             Item 2

ListView 可视化树：

Windows.UI.Xaml.Controls.ListView
 Windows.UI.Xaml.Controls.Border
  Windows.UI.Xaml.Controls.ScrollViewer
   Windows.UI.Xaml.Controls.Border
    Windows.UI.Xaml.Controls.Grid
     Windows.UI.Xaml.Controls.ScrollContentPresenter
      Windows.UI.Xaml.Controls.ItemsPresenter
       Windows.UI.Xaml.Controls.ContentControl
       Windows.UI.Xaml.Controls.ItemsstackPanel
        Windows.UI.Xaml.Controls.ListViewHeaderItem
        Windows.UI.Xaml.Controls.ListViewHeaderItem
        Windows.UI.Xaml.Controls.ListViewItem 1
        Windows.UI.Xaml.Controls.ListViewItem 2

解决方法

您的代码已生成 HeaderItem。

因为您的 CustomerView 继承自 ItemsControl，所以生成的 HeaderItem 没有样式。

所以如果你想这样做，请手动添加更改样式，如下所示。

<CustomerView.GroupStyle>
    <GroupStyle>
        <GroupStyle.HeaderTemplate>
            <DataTemplate>
                <ListViewHeaderItem>
                    <StackPanel>
                        <TextBlock Text="{Binding Key}"/>
                    </StackPanel>
                </ListViewHeaderItem>
            </DataTemplate>
        </GroupStyle.HeaderTemplate>
    </GroupStyle>
 </CustomerView.GroupStyle>
c#c#collectionviewsourceitemscontroluwp