WPF教程（二十六）StackPanel

StackPanel基本和WrapPanel一样，但是有一个重要的区别：StackPanel不会自动切换内容。相反，它会让内容朝一个方向延伸，一个接一个的堆起来。先来快速看一个例子：

<span style="font-size:14px;"><Window x:Class="WpfTutorialSamples.Panels.StackPanel"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StackPanel" Height="160" Width="300">
        <StackPanel>
                <Button>Button 1</Button>
                <Button>Button 2</Button>
                <Button>Button 3</Button>
                <Button>Button 4</Button>
                <Button>Button 5</Button>
                <Button>Button 6</Button>
        </StackPanel>
</Window></span>

一眼就能看出StackPanel根本不管是否有足够的空间放下里面的内容，它不会以任何形式包住内容，也不会自动提供滚动的功能（你可以添加一个ScrollViewer控件来实现滚动，后面会讲到）。

我们还发现，StackPanel默认的排列方向是垂直的，不像WrapPanel默认的是水平方向。这个方向也是很容易就能修改的：

<span style="font-size:14px;"><StackPanel Orientation="Horizontal"></span>

另外一个你值得注意的是，StackPanel会自动延伸它的子控件。在一个垂直向的StackPanel里，所有的子控件往水平方向延伸，如前面第一个例子就是。而在一个水平向的StackPanel，所有子控件往垂直方向延伸，如上面这个例子。StackPanel通过设置子控件的HorizontalAlignment和VerticalAlignment属性来实现延伸，你可以随时重写这两个属性。下面我们把上面的例子稍作修改，给所有的按钮指定VerticalAlignment属性：

<span style="font-size:14px;"><Window x:Class="WpfTutorialSamples.Panels.StackPanel"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StackPanel" Height="160" Width="300">
        <StackPanel Orientation="Horizontal">
                <Button VerticalAlignment="Top">Button 1</Button>
                <Button VerticalAlignment="Center">Button 2</Button>
                <Button VerticalAlignment="Bottom">Button 3</Button>
                <Button VerticalAlignment="Bottom">Button 4</Button>
                <Button VerticalAlignment="Center">Button 5</Button>
                <Button VerticalAlignment="Top">Button 6</Button>
        </StackPanel>
</Window></span>

我们使用Top、Center和Bottom值来将按钮放置成一个漂亮的模式，当然只是为了好玩。同样的，垂直向的StackPanel也可以这样做，使用HorizontalAlignment属性：

<span style="font-size:14px;"><Window x:Class="WpfTutorialSamples.Panels.StackPanel"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StackPanel" Height="160" Width="300">
        <StackPanel Orientation="Vertical">
                <Button HorizontalAlignment="Left">Button 1</Button>
                <Button HorizontalAlignment="Center">Button 2</Button>
                <Button HorizontalAlignment="Right">Button 3</Button>
                <Button HorizontalAlignment="Right">Button 4</Button>
                <Button HorizontalAlignment="Center">Button 5</Button>
                <Button HorizontalAlignment="Left">Button 6</Button>
        </StackPanel>
</Window></span>

如你所见，按钮依旧从上往下排列，不同的是它们按设置的属性值分布到左边、右边和中间。