user3530012
user3530012

Reputation: 740

ListView with horizontal wrapped arrangement of items

I want to layout items in a WPF listview in a similar manner to GridView in Windows store application. Items are grouped horizontally and each group panel lays out items horizontally warpped, something like this:

Group 1                 Group2                  Group3
Item1, Item2, Item3     Item1, Item2, Item3     Item1, Item2, Item3
Item4                   Item4                   Item4

I've tried working with StackPanel and WrapPanel but never get the result I mentioned above.

Any help appreciated.

Thanks a lot.

Upvotes: 2

Views: 472

Answers (2)

Harjeet Singh
Harjeet Singh

Reputation: 396

yes , i have done it, please follow below link:

http://amritverma88.blogspot.in/

Upvotes: 0

Jason Down
Jason Down

Reputation: 22151

You could try something like this:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <StackPanel Orientation="Vertical" Grid.Column="0">
        <TextBlock Text="Group 1"/>
        <WrapPanel>
            <TextBlock Text="Item 1, "/>
            <TextBlock Text="Item 2, "/>
            <TextBlock Text="Item 3, "/>
            <TextBlock Text="Item 4"/>
        </WrapPanel>
    </StackPanel>
    <StackPanel Orientation="Vertical" Grid.Column="1">
        <TextBlock Text="Group 2"/>
        <WrapPanel>
            <TextBlock Text="Item 1, "/>
            <TextBlock Text="Item 2, "/>
            <TextBlock Text="Item 3, "/>
            <TextBlock Text="Item 4"/>
        </WrapPanel>
    </StackPanel>
    <StackPanel Orientation="Vertical" Grid.Column="2" Width="auto">
        <TextBlock Text="Group 3"/>
        <WrapPanel>
            <TextBlock Text="Item 1, "/>
            <TextBlock Text="Item 2, "/>
            <TextBlock Text="Item 3, "/>
            <TextBlock Text="Item 4"/>
        </WrapPanel>
    </StackPanel>
</Grid>

Instead of putting the items as TextBlocks (with hard coded commas), you would likely use an itemscontrol (see this answer).

Here is a sample screenshot:

enter image description here

Upvotes: 2

Related Questions