Jonatan Grim
Jonatan Grim

Reputation: 93

Horizontal Orientation in Stackpanel, new line at the end of Stackpanel width

Let's say that we have a Stackpanel with Horizontal Orientation and a width of 100px.

Inside it i make eleven square Canvas drawings width the size of 10px.

This means that the last square will be outside of view, because it will extend the stackpanel width 10px. So I want this square to be in a new line.

Is there a Control that can do this? The hard part is that the Stackpanel will be dynamic, so if i Resized the WPF window, the Stackpanel will be 50px, wich will result in 2 full square lines and a third line with a single square.

I hope this makes sence. How can I do this?

Thanks, Jonatan

Upvotes: 8

Views: 7570

Answers (2)

Dragos Stoica
Dragos Stoica

Reputation: 1935

I think you should use WrapPanelinstead of StackPanel or apply this style :

<StackPanel>
        <StackPanel.Style>
            <Style TargetType="{x:Type StackPanel}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type StackPanel}">
                            <WrapPanel/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </StackPanel.Style>
    </StackPanel>

Upvotes: 6

Muds
Muds

Reputation: 4116

Wrap panel is what you need in this case

    <WrapPanel  Width="100" Orientation="Horizontal">
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
        <Button   Width="10" Height="20"/>
    </WrapPanel>

Upvotes: 11

Related Questions