WPF ListView与项目的水平排列？

Question

我想以类似于列表模式下的WinForms ListView的方式在ListView中布置项目.也就是说,在ListView中不仅在垂直方向而且在水平方向上布置项目.

我不介意这些物品的布局是这样的:

1 4 7
2 5 8
3 6 9

或者像这样:

1 2 3
4 5 6
7 8 9

只要它们在垂直和水平方向呈现,以便最大限度地利用可用空间.

我能找到的最接近的是这个问题:

如何使WPF ListView项目水平重复,如水平滚动条？

只能水平放置项目.

Answer 1

听起来你正在寻找的是一个WrapPannel,它会将项目水平放置,直到没有空间,然后移动到下一行,如下所示:

(MSDN)
替代文字http://i.msdn.microsoft.com/Cc295081.b1c415fb-9a32-4a18-aa0b-308fca994ac9(en-us,Expression.10).png

您还可以使用UniformGrid,它将在一定数量的行或列中放置项目.

我们使用ListView,ListBox或任何形式的ItemsControl中的其他面板来获取项目的方式是通过更改ItemsPanel属性.通过设置ItemsPanel,您可以从ItemsControls使用的默认StackPanel更改它.使用WrapPanel,我们还应该设置宽度,如下所示.

<ListView>
   <ListView.ItemsPanel>
      <ItemsPanelTemplate>
         <WrapPanel Width="{Binding (FrameworkElement.ActualWidth), 
            RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}"
            ItemWidth="{Binding (ListView.View).ItemWidth, 
            RelativeSource={RelativeSource AncestorType=ListView}}"
            MinWidth="{Binding ItemWidth, RelativeSource={RelativeSource Self}}"
            ItemHeight="{Binding (ListView.View).ItemHeight, 
            RelativeSource={RelativeSource AncestorType=ListView}}" />
      </ItemsPanelTemplate>
   </ListView.ItemsPanel>
...
</ListView>

Answer 2

我最近研究如何在WPF中实现这一点,并找到了一个很好的解决方案.我想要的是在Windows资源管理器中复制列表模式,即从上到下,然后从左到右.

基本上你想要做什么覆盖ListBox.ItemsPanel属性以使用WrapPanel,其方向设置为Vertical.

<ListBox>
  <ListBox.ItemsPanel>
    <ItemsPanelTemplate>      
      <WrapPanel Orientation="Vertical"/>
    </ItemsPanelTemplate>
  </ListBox.ItemsPanel>
</ListBox>

但是,在加载大型数据集时,这将很慢,因为包装面板未进行虚拟化.这个很重要.因此,现在您需要通过扩展VirtualizedPanel并实现IScrollInfo来编写自己的VirtualizedWrapPanel.

public class VirtualizedWrapPanel : VirtualizedPanel, IScrollInfo
{
   // ...
}

这是我在进行另一项任务之前进行的研究.如果您想了解更多信息或示例,请发表评论.

更新.Ben Constable有很多关于如何实现IScrollInfo的系列文章.

共有4篇文章.一个非常好的阅读.

我已经实现了虚拟化的包装面板,即使借助上述系列文章也不是一件容易的事.

Answer 3

就我而言,最好的选择是使用:

        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel Orientation="Vertical"
                    MaxHeight="{Binding (FrameworkElement.ActualHeight), RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}"
                               ItemWidth="{Binding (ListView.View).ItemWidth, RelativeSource={RelativeSource AncestorType=ListView}}"
                               MinHeight="{Binding ItemHeight, RelativeSource={RelativeSource Self}}"
                               ItemHeight="{Binding (ListView.View).ItemHeight, RelativeSource={RelativeSource AncestorType=ListView}}"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

这给了我一个不错的模拟Windows资源管理器的列表选项