在wpf中将垂直方向的栅格居中

我开始在WinForm中为一个应用程序做UI，但我刚刚读到关于WPF的内容，我决定重新做我的工作。但因为是一个新的想法，我遇到了一个小问题：

正如您在下面的屏幕截图中看到的，我有3个垂直按钮，它们位于主窗体的中心。如何在WPF中实现同样的效果？我尝试过任何我能找到的改变立场的方法，但都失败了

这是我的主要表单XAML：

<Window x:Class="YouTubeMusicPlayerWpf.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:YouTubeMusicPlayerWpf"
        xmlns:fa="http://schemas.fontawesome.io/icons/"
        mc:Ignorable="d" Height="500" Width="900" Background="Black" WindowStyle="None" AllowsTransparency="true" WindowStartupLocation="CenterScreen" Name="mainWindow">
    <WindowChrome.WindowChrome>
        <WindowChrome ResizeBorderThickness="6" CornerRadius="0" GlassFrameThickness="0">
        </WindowChrome>
    </WindowChrome.WindowChrome>
    <StackPanel Background="#FF201E2B">
        <!-- TitleBar buttons -->
        <Grid HorizontalAlignment="Right">
            <StackPanel Orientation="Horizontal">
                <Button fa:Awesome.Content="WindowMinimize" Background="Transparent" Foreground="White" VerticalAlignment="Stretch" Padding="8" BorderThickness="0" WindowChrome.IsHitTestVisibleInChrome="True" Name="minButton" Click="MinButton_OnClick"></Button>
                <Button fa:Awesome.Content="WindowMaximize" Background="Transparent" Foreground="White" VerticalAlignment="Stretch" Padding="8" BorderThickness="0" WindowChrome.IsHitTestVisibleInChrome="True" Name="maxButton" Click="MaxButton_OnClick"></Button>
                <Button fa:Awesome.Content="WindowClose" Background="Transparent" Foreground="White" VerticalAlignment="Stretch" Padding="8" BorderThickness="0" WindowChrome.IsHitTestVisibleInChrome="True" Name="closeButton" Click="CloseButton_OnClick"></Button>
            </StackPanel>
        </Grid>
        <!-- Menu Buttons-->
        <Grid HorizontalAlignment="Left" VerticalAlignment="Center">
            <StackPanel Orientation="Vertical">
                <Button fa:Awesome.Content="Youtube" FontSize="40" Background="#00000000" Foreground="White" BorderBrush="Transparent" Width="80" Height="80" VerticalAlignment="Center" HorizontalAlignment="Center"></Button>
                <Button fa:Awesome.Content="Music" FontSize="40" Background="#00000000" Foreground="White" BorderBrush="Transparent" Width="80" Height="80" VerticalAlignment="Center" HorizontalAlignment="Center"></Button>
                <Button fa:Awesome.Content="Download" FontSize="40" Background="#00000000" Foreground="White" BorderBrush="Transparent" Width="80" Height="80" VerticalAlignment="Center" HorizontalAlignment="Center"></Button>
            </StackPanel>
        </Grid>
    </StackPanel>
</Window>

---

问题在于根元素。用网格替换StackPanel并解决问题

奖励：如果您是WPF新手，我将向您展示如何重构您的样式

<Grid Background="Black">
    <Grid.Resources>
        <!--  Exemple of a style with a key to reuse  -->
        <Style x:Key="LeftButtonStyle" TargetType="Button">
            <Setter Property="FontSize" Value="40" />
            <Setter Property="Width" Value="80" />
            <Setter Property="Height" Value="80" />
            <Setter Property="Background" Value="#00000000" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="BorderBrush" Value="Transparent" />
        </Style>
    </Grid.Resources>
    <!--  TitleBar buttons  -->
    <StackPanel
        HorizontalAlignment="Right"
        VerticalAlignment="Top"
        Orientation="Horizontal">
        <StackPanel.Resources>
            <!--  Exemple of a implicit styles that will be set to each child with a matching type  -->
            <!--  Notice there is no x:Key  -->
            <Style TargetType="Button">
                <Setter Property="Background" Value="Transparent" />
                <Setter Property="Foreground" Value="White" />
                <Setter Property="Padding" Value="8" />
                <Setter Property="BorderThickness" Value="0" />
            </Style>
        </StackPanel.Resources>
        <Button Content="b1" />
        <Button Content="b2" />
        <Button Content="b3" />
    </StackPanel>
    <!--  Menu Buttons  -->
    <StackPanel
        HorizontalAlignment="Left"
        VerticalAlignment="Center"
        Orientation="Vertical">
        <Button Content="icon" Style="{StaticResource LeftButtonStyle}" />
        <Button Content="icon" Style="{StaticResource LeftButtonStyle}" />
        <Button Content="icon" Style="{StaticResource LeftButtonStyle}" />
    </StackPanel>
</Grid>

请注意，既没有行定义，也没有列定义

下面是如何对place执行相同的操作以设置内容（例如红色框）

---

嘿！谢谢你的回答和奖金。此时，红盒示例非常有助于使UI接近winForm中的UI

<Grid Background="Black">
    <Grid.Resources>
        <!--  Exemple of a style with a key to reuse  -->
        <Style x:Key="LeftButtonStyle" TargetType="Button">
            <Setter Property="FontSize" Value="40" />
            <Setter Property="Width" Value="80" />
            <Setter Property="Height" Value="80" />
            <Setter Property="Background" Value="#00000000" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="BorderBrush" Value="Transparent" />
        </Style>
    </Grid.Resources>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition />
    </Grid.RowDefinitions>
    <!--  TitleBar buttons  -->
    <StackPanel
        Grid.Column="1"
        HorizontalAlignment="Right"
        Orientation="Horizontal">
        <StackPanel.Resources>
            <!--  Exemple of a implicit styles that will be set to each child with a matching type  -->
            <!--  Notice there is no x:Key  -->
            <Style TargetType="Button">
                <Setter Property="Background" Value="Transparent" />
                <Setter Property="Foreground" Value="White" />
                <Setter Property="Padding" Value="8" />
                <Setter Property="BorderThickness" Value="0" />
            </Style>
        </StackPanel.Resources>
        <Button Content="b1" />
        <Button Content="b2" />
        <Button Content="b3" />
    </StackPanel>
    <!--  Menu Buttons  -->
    <StackPanel
        Grid.RowSpan="2"
        HorizontalAlignment="Left"
        VerticalAlignment="Center"
        Orientation="Vertical">
        <Button Content="icon" Style="{StaticResource LeftButtonStyle}" />
        <Button Content="icon" Style="{StaticResource LeftButtonStyle}" />
        <Button Content="icon" Style="{StaticResource LeftButtonStyle}" />
    </StackPanel>

    <Grid Background="Red" Grid.Row="1" Grid.Column="1"/>
</Grid>