Floating ItemsControl

Question

The ItemsControl I need must have this appearance:

For ItemsPanel I have set a StackPanel with a horizontal orientation.

<Style TargetType="local:ParameterItemContainer">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:ParameterItemContainer">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                    <Grid >
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>

                        <ItemsPresenter Margin="{TemplateBinding Margin}" />
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

ParameterItemContainer derives from ItemsControl.

Don't know how to implement the template correctly to get the same appearance as my screenshot, or do I have to override a function to set the correct layout?

Answer 1

I'm not sure what you mean by "Floating ItemsControl", however if you're only looking to display rows of 6 items at a time in an ItemsControl you can set the ItemsPanelTemplate to a WrapPanel with Orientation="Vertical", and give it a Height of whatever 6x items would be.

<ItemsPanelTemplate>
    <WrapPanel Orientation="Vertical" Height="300" />
</ItemsPanelTemplate>

This will have WPF drawing items vertically until it hits the height limit, then it will wrap to a new column horizontally to continue drawing items.