将子控件添加到WrapPanel

Question

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 ?

Answer 1

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:

Answer 2

你应该使用WrapPanel满足你的要求。

Answer 3

将StackPanel包装在ScrollViewer并在刚刚添加的元素上调用ScrollIntoView() 。

Answer 4

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>

Answer 5

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");