为什么这个边框没有移动到父 StackPanel 的垂直中心，而是在网格中移动？

Question

在我的Grid我有以下StackPanel ：

<StackPanel Grid.Row="6" Grid.Column="4"  Margin="5, 5, 10, 5" VerticalAlignment="Stretch" Background="Yellow" Orientation="Vertical">
   <Border Background="LightGray" BorderThickness="1" BorderBrush="Black" VerticalAlignment="Center">
      <StackPanel Orientation="Vertical">
         <Button BorderThickness="0" Background="Transparent" Margin="0 10" HorizontalAlignment="Center">
            <Button.Content>
               <Image Source="\Resources\Arrow2 Up.ico"/>
            </Button.Content>
         </Button>
         <Button BorderThickness="0" Background="Transparent" Margin="0 10" HorizontalAlignment="Center">
            <Button.Content>
               <Image Source="\Resources\Arrow2 Down.ico"/>
            </Button.Content>
         </Button>
      </StackPanel>
   </Border>
</StackPanel>

我将背景设为黄色，因此我们可以看到StackPanel的大小。 整个事情看起来如下：

我想让按钮位于垂直中心。 我可以通过用另一个Grid替换外部StackPanel来实现这一点，我们得到以下结果。

似乎StackPanel不知道自己的实际高度，但Grid知道吗？ 为什么会这样，或者这种行为还有其他原因吗？

Answer 1

根据定义， StackPanel根据其Orientation从上到下垂直堆叠元素或从左到右（或从右到左使用FlowDirection="RightToLeft" ）垂直堆叠元素。

将子元素排列成可以水平或垂直定向的单行。

这就是它所做的一切，它不考虑基于可用空间的比例大小。 另一方面， Grid具有可以利用星号大小来实现这一点的列和行。

在 Grid 中定义的列和行可以利用 Star 大小来按比例分配剩余空间。 当STAR被选为行或列的高度或宽度时，该列或行接收剩余可用空间的加权比例。

在您的情况下，您甚至可能不需要StackPanel 。 您可以将您的Border直接放在Grid并相应地设置它的VerticalAlignment和HorizontalAligment属性，例如：

<Border Grid.Row="6" Grid.Column="4"  Margin="5, 5, 10, 5" Background="LightGray" BorderThickness="1" BorderBrush="Black" VerticalAlignment="Center">