xaml – 在Windows Phone上设置ListView的GroupStyle.Panel

发布时间：2020-12-14 02:27:59 所属栏目：Windows 来源：网络整理

导读：我正在尝试使用分组创建一个ListView,其中每个组中的元素都是水平显示的(作为可滚动内容).无论我尝试使用ListView的GroupStyle.Panel,它似乎对列表没有任何影响. 以下是我的XAML的外观： ListView x:Name="itemListView" Padding="10" SelectionMode="None"

我正在尝试使用分组创建一个ListView,其中每个组中的元素都是水平显示的(作为可滚动内容).无论我尝试使用ListView的GroupStyle.Panel,它似乎对列表没有任何影响.

以下是我的XAML的外观：

<ListView x:Name="itemListView"
            Padding="10"                
            SelectionMode="None"
            IsSwipeEnabled="False"
            IsItemClickEnabled="True"
            ItemTemplate="{StaticResource listItemTemplate}">
     <ListView.GroupStyle>
        <GroupStyle>
           <GroupStyle.Panel>
              <ItemsPanelTemplate>
                 <ItemsWrapGrid ItemWidth="144" Orientation="Horizontal" />
              </ItemsPanelTemplate>
           </GroupStyle.Panel>
           <GroupStyle.HeaderTemplate>
              <DataTemplate>
                 <Grid>
                    <TextBlock Text="{Binding DisplayTitle}" 
                               Margin="0,10,5"
                               Foreground="Black"
                               Style="{StaticResource SubheaderTextBlockStyle}" 
                               TextWrapping="NoWrap" />
                 </Grid>
              </DataTemplate>
           </GroupStyle.HeaderTemplate>
        </GroupStyle>
     </ListView.GroupStyle>
  </ListView>

哪里

<Page.Resources>
   <DataTemplate x:Key="listItemTemplate">
      <Grid Width="144" Margin="5">
         <!-- details -->
      </Grid>
   </DataTemplate>
</Page.Resources>

下图显示了我得到的实际结果,右边显示了我想要的结果.

我尝试使用具有不同属性的ItemsWrapGrid,我尝试了StackPanel甚至是VariableSizedWrapGrid,但是列表项的显示方式没有任何改变.

如何才能做到这一点？

解决方法

@kubakista是对的

It looks like if ListView.ItemsPanel contains ItemsStackPanel then
GroupStyle.Panel is ignored…

但是,更改此项不会解决您的问题 –

>滚动变得有点滞后.
>没有水平滚动.
> ListView失去了虚拟化.
>滚动动画的好组头不见了.

这里有一个替代方案,不需要改变ListView本身的结构,而是对数据结构进行一些修改.

这个想法是,将组下的每个水平矩形列表视为UI上的一个集合项.

这意味着,ListView中的每个组只有一个子节点,它实际上是将在水平可滚动ItemsControl中呈现的矩形集合.

因此,假设您有一些ObservableCollection类型的集合< Item>作为CollectionViewSource,Item现在将成为< ObservableCollection< Item>>的类型.为了保存矩形的集合.因此,需要将集合的类型更新为ObservableCollection< ObservableCollection< Item>>.

在ListView的ItemTemplate中,您需要创建一个水平滚动的ScrollViewer并将ItemsControl放入其中.确保将后者的ItemsSource设置为{Binding}.

要启用水平滑动,您需要通过编辑ListViewItem的默认样式并注释掉以下代码来禁用倾斜效果.

<!--
<VisualStateGroup.Transitions>
    <VisualTransition From="Pressed" To="Normal">
        <Storyboard>
            <PointerUpThemeAnimation Storyboard.TargetName="TiltContainer"/>
        </Storyboard>
    </VisualTransition>
</VisualStateGroup.Transitions>
<VisualState x:Name="Normal"/>
<VisualState x:Name="Pressed">
    <Storyboard>
        <PointerDownThemeAnimation Storyboard.TargetName="TiltContainer"/>
    </Storyboard>
</VisualState>
-->

我附上了一个工作示例项目here以及如下所示的屏幕截图.

希望这可以帮助！

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!