StackPanel is the simplest Panel element in XAML. It lays
out your elements in a manner similar to a stack.
StackPanel has an Orientation attribute that represents the
orientation of it. This attribute can get two values: Horizontal and
Vertical. Default is Vertical.
StackPanel shows your elements respectively according to the
order you declared them in XAML file.
Listing 2 and 3 represent a Vertical and Horizontal
StackPanel, respectively, that contain three TextBoxes (I used background
colors to help you find the position of TextBoxes easier) and Figure 2 and 3
are their output.
Listing 2
<Window x:Class="LayoutinXAML.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Layout in XAML" Height="150" Width="300"
>
<StackPanel>
<TextBox Background="Coral">
ASP Alliance 1
</TextBox>
<TextBox Background="Plum">
ASP Alliance 2
</TextBox>
<TextBox Background="Aquamarine">
ASP Alliance 3
</TextBox>
</StackPanel>
</Window>
Figure 2
Listing 3
<Window x:Class="LayoutinXAML.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Layout in XAML" Height="150" Width="300"
>
<StackPanel Orientation="Horizontal">
<TextBox Background="Coral">
ASP Alliance 1
</TextBox>
<TextBox Background="Plum">
ASP Alliance 2
</TextBox>
<TextBox Background="Aquamarine">
ASP Alliance 3
</TextBox>
</StackPanel>
</Window>
Figure 3
Note that the width and height of a StackPanel governs the width
and height of its children. This means if you set a large width or height for
your elements that exceeds the width and height of a StackPanel, they will be
cut. Listing 4 and Figure 4 show this in action.
Listing 4
<Window x:Class="LayoutinXAML.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Layout in XAML" Height="150" Width="300"
>
<StackPanel Width="200">
<TextBox Background="Coral" Width="300">
ASP Alliance 1
</TextBox>
<TextBox Background="Plum">
ASP Alliance 2
</TextBox>
<TextBox Background="Aquamarine">
ASP Alliance 3
</TextBox>
</StackPanel>
</Window>
Figure 4
