StackPanel :将子元素排列成水平或垂直的一行。
实例1 StackPanel可以将控件按顺序以此排列,不会像Grid那样将控件堆积在一起,如图1所示。StackPanel布局时当删除某一控件后,其余控件会自动将间隙补全。
StackPanel通过设置Orientation的值为Horizontal或者Vertical,来确定控件排列方式为水平或垂直,不设置则默认垂直排列。
StackPanel布局,可以通过设置控件的Margin值来让连在一起的标签有一定的间距,如图2所示。
<Grid>
<StackPanel Width="100" Height="100" VerticalAlignment="Top" HorizontalAlignment="Left">
<Label Background="AliceBlue">我是标签1</Label>
<Label Background="AliceBlue">我是标签2</Label>
<Label Background="AliceBlue">我是标签3</Label>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="120,0" Width="200" Height="50" VerticalAlignment="Top" HorizontalAlignment="Left">
<Label Background="AliceBlue">我是标签1</Label>
<Label Background="AliceBlue">我是标签2</Label>
<Label Background="AliceBlue">我是标签3</Label>
</StackPanel>
<Grid Width="100" Height="60" VerticalAlignment="Top">
<Label Background="Brown">我是标签4</Label>
<Label Background="Brown">我是标签5</Label>
<Label Background="AliceBlue">我是标签6</Label>
</Grid>
</Grid>
图1
<StackPanel Width="100" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left">
<Label Margin="0,0,0,10" Background="AliceBlue">我是标签1</Label>
<Label Margin="0,0,0,30" Background="AliceBlue">我是标签2</Label>
<Label Background="AliceBlue">我是标签3</Label>
</StackPanel>
图2