shanmugharaj
shanmugharaj

Reputation: 3924

Adding child controls to a WrapPanel

I am very much new to WPF.

I have a very simple problem.

I have a stackpanel spTerminalBox.

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="300"/>
        <ColumnDefinition Width="881*"/>
        <ColumnDefinition Width="11*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="156"/>
        <RowDefinition Height="371*"/>
    </Grid.RowDefinitions>
    <my:WindowHeader x:Name="title" Title="Internet Cafe management software (ICM)"   CloseClicked="window_CloseClicked"   VerticalAlignment="Top" Margin="0,-1,0,0" Grid.ColumnSpan="3" />
    <StackPanel Name ="spTerminalBox" Grid.Column="1" Grid.Row="1" Orientation="Horizontal" Margin="10,10,10,20"/>
</Grid>

My xaml structure is that.

I am filling a user control in that stackpanel dynamically in code. Once if child elements on a StackPanel do not fit in the StackPanel area, then it should not go outside of the visible area, it should come down.

How to achieve this ?

Upvotes: 16

Views: 56261

Answers (5)

makc
makc

Reputation: 2579

Instead of using StackPanel and adding UserControls use ListBox which you'll bind to an ObservableCollection. The 'ObservableCollection' will notify the ListBox when items are added/removed.
Change the ListBox.ItemsPanel to be Wrappanel instead of StackPanel

taken from http://wpftutorial.net/
"The wrap panel is similar to the StackPanel but it does not just stack all child elements to one row, it wraps them to new lines if no space is left. The Orientation can be set to Horizontal or Vertical."

you Xaml should look like this:

<ListBox  x:Name="MyListBox"
          ItemsSource="{Binding Source={StaticResource UserControlsObservableCollection}}"                                  
          HorizontalContentAlignment="Stretch"
          ScrollViewer.HorizontalScrollBarVisibility="Disabled"
          ScrollViewer.VerticalScrollBarVisibility="Disabled" >
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
              <WrapPanel />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>

Upvotes: 1

Somedust
Somedust

Reputation: 1170

XAML:

<Window x:Class="WpfTestBench.PanelSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="PanelSample" Height="300" Width="300">
    <Grid>
        <WrapPanel Name="MyPanel" />
    </Grid>
</Window>

Codebehind:

using System.Windows;
using System.Windows.Media;
using System.Windows.Shapes;

namespace WpfTestBench
{
    public partial class PanelSample
    {
        public PanelSample()
        {
            InitializeComponent();

            for (var i = 0; i < 5; i++)
            {
                MyPanel.Children.Add(new Rectangle
                {
                    Width = 100,
                    Height = 20,
                    StrokeThickness = 1,
                    Stroke = new SolidColorBrush(Colors.Black),
                    Margin = new Thickness(5)
                });
            }
        }
    }
}

Execution result:

Wide Narrow

Upvotes: 28

Herm
Herm

Reputation: 2999

you should use a WrapPanel for your requirements.

Upvotes: 5

BRAHIM Kamel
BRAHIM Kamel

Reputation: 13765

it will be better to use for your case it has an attached property ready for this but StackPanel will work in FIFO

DockPanel

for example 

            Button btn = new Button();
            DockPanel.SetDock(btn,Dock.Bottom);
            dockPanelTerminalBox.Children.Add(btn); 

but if you want just use this in your code behind

spTerminalBox.Children.Add("yourControl"); 

Upvotes: 0

GazTheDestroyer
GazTheDestroyer

Reputation: 21241

Wrap your StackPanel in a ScrollViewer and call ScrollIntoView() on the element you just added.

Upvotes: 1

Related Questions