前言
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>