WPF ListView with horizontal arrangement of items?

It sounds like what you are looking for is a WrapPannel, which will lay the items out horizontally until there is no more room, and then move to the next line, like this:

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

You also could use a UniformGrid, which will lay the items out in a set number of rows or columns.

The way we get the items to arange using these other panels in a ListView, ListBox, or any form of ItemsControl is by changing the ItemsPanel property. By setting the ItemsPanel you can change it from the default StackPanel that is used by ItemsControls. With the WrapPanel we also should set the widths as shown here.

<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>

I recently research how to achieve this in WPF and found a good solution. What I wanted was to the replicate the List mode in Windows Explorer, i.e. top-to-bottom, then left-to-right.

Basically what you want to do override the ListBox.ItemsPanel property to use a WrapPanel with it's orientation set to Vertical.

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

However this WILL be slow when loading a large data set as it the wrap panel is not virtualised. This is important. So this task now becomes a little more as now you need to write your own VirtualizedWrapPanel by extending VirtualizedPanel and implementing IScrollInfo.

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

This is as far as I got in my research before having to go off to another task. If you want more information or examples, please comment.

UPDATE. Ben Constable's has a great series on how to implement IScrollInfo.

There are 4 articles in total. A really good read.

I have since implemented a virtualized wrap panel, it is not an easy task even with the help of the above series of articles.

In my case, the best option was to use:

        <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>

This gave me a decent analog to Windows Explorer's List option