StackPanel控件也是用于布局的，可以使多个子控件按横向或者纵向排列，并且可以根据自身大  小拉伸子控件。

 StackPanel默认情况下为纵向排列，当Orientation设置为Horizontal时，横向排列。

 StackPanel-堆放容器 将子元素排列成一行（可沿水平或垂直方向）。

 StackPanel的规则是：根据附加属性，我要么让元素横着排列，要么竖着排列。

 StackPanel 为启用布局的 Panel 元素之一。在特定情形下，例如，要将一组对象排列在竖直或  水平列表（例如，项的水平或竖直菜单）中，StackPanel 很有用。设置 Orientation 属性可确  定列表的方向。Orientation 属性的默认值为 Vertical。

 StackPanel 中内容的 HorizontalAlignment 和 VerticalAlignment 默认值均为 Stretch。

 附上代码：

1. <!--LayoutRoot 是包含所有页面内容的根网格--> 
2.     <Grid x:Name="LayoutRoot" Background="Transparent"> 
3.         <StackPanel Orientation="Vertical"> 
4.             <Button Content="元素1" ></Button> 
5.             <Button Content="元素2" ></Button> 
6.             <Button Content="元素3" ></Button> 
7.         </StackPanel> 
8.     </Grid> 

 效果为：

 附上代码：

1. <!--LayoutRoot 是包含所有页面内容的根网格--> 
2.     <Grid x:Name="LayoutRoot" Background="Transparent"> 
3.         <StackPanel Orientation="Horizontal"> 
4.             <Button Content="元素1" ></Button> 
5.             <Button Content="元素2" ></Button> 
6.             <Button Content="元素3" ></Button> 
7.         </StackPanel> 
8.     </Grid> 

 效果为： 

 示例二：

1. <!--LayoutRoot contains the root grid where all other page content is placed--> 
2.    <Grid x:Name="LayoutRoot" Background="Transparent"> 
3.        <Grid.RowDefinitions> 
4.            <RowDefinition Height="Auto"/> 
5.            <RowDefinition Height="*"/> 
6.        </Grid.RowDefinitions> 
7.  
8.        <!--TitlePanel contains the name of the application and page title--> 
9.        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 
10.            <TextBlock x:Name="ApplicationTitle" Text="STACKPANEL WITH FOUR ELEMENTS" Style="{StaticResource PhoneTextNormalStyle}"/> 
11.        </StackPanel> 
12.  
13.        <!--ContentPanel - place additional content here--> 
14.        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 
15.            <StackPanel Name="stackPanel" Orientation="Vertical"> 
16.                <TextBlock Text="TextBlock aligned at right bottom" 
17.                           HorizontalAlignment="Right" 
18.                           VerticalAlignment="Bottom" /> 
19.                <Image Name="p_w_picpath1" Source="/PhoneApp2;component/Images/1-12101Q43P9.jpg" /> 
20.                <Ellipse Stroke="{StaticResource PhoneAccentBrush}" 
21.                         StrokeThickness="12" /> 
22.                <TextBlock Text="TextBlock aligned at left top" 
23.                           HorizontalAlignment="Left" 
24.                           VerticalAlignment="Top" /> 
25.            </StackPanel> 
26.        </Grid> 
27.    </Grid> 

 效果图为：