前言
StackPanel是WPF 中的布局容器之一,它的核心功能是将其子元素按水平或者垂直方向进行排列。
1、Orientation
该属性指定StackPanel中元素的排列方式,是水平排列还是垂直排列。
1)Vertical
元素垂直方向紧凑排列。
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Vertical" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 2" />
</StackPanel>
</Window>

2)Horizontal
元素水平方向紧凑排列。
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Horizontal" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 2" />
</StackPanel>
</Window>

2、HorizontalAlignment
该属性指定元素水平方向上的对齐方式
1)Left
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Vertical" HorizontalAlignment="Left" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 2" />
</StackPanel>
</Window>

2)Right

3)Center
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Vertical" HorizontalAlignment="Center" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 2" />
</StackPanel>
</Window>

4)Stretch
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Vertical" HorizontalAlignment="Stretch" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 2" />
</StackPanel>
</Window>

3、VerticalAlignment
该属性指定元素垂直方向上的对齐方式
1)Top
2)Bottom
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Horizontal" VerticalAlignment ="Bottom" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 3" />
</StackPanel>
</Window>

3)Center
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Horizontal" VerticalAlignment ="Center" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 3" />
</StackPanel>
</Window>

4)Stretch
csharp
<Window x:Class="wpf之StackPanel.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpf之StackPanel"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<StackPanel Orientation="Horizontal" VerticalAlignment ="Stretch" >
<TextBlock Background="Red" Text=" 1" />
<TextBlock Background="Blue" Text=" 2" />
<TextBlock Background="Green" Text=" 3" />
</StackPanel>
</Window>
