C#WPF ContentPresenter菜单项文本对齐

首先我想说的是，我是C#WPF的新手。 我已经搜索了很多，但到目前为止，我还没有找到一个适当的解决方案，我的问题，我希望有人可以帮助我现在

现在来看看我的问题：

我有一个C#WPF应用程序，其中有一个菜单。我正在使用Window.resources区域为x:Type菜单项定义新模板。 到目前为止，这是可行的

但是，我无法将文本放在多行（多行）菜单的中心位置

我有一个菜单项，上面写着“成本概述”。这应该在它们之间居中显示，因为我给了菜单一个固定的宽度

我想要这样的东西（只是居中）：

这里我介绍了我当前使用的样式模板：

<Style x:Key="MenuItem" TargetType="{x:Type MenuItem}">
        <Setter Property="Background" Value="#FF6C6D6E"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="BorderBrush" Value="{x:Null}"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Width" Value="60"/>
        <Setter Property="Height" Value="90"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type MenuItem}">
                    <Border x:Name="Border" Background="{TemplateBinding Background}"  BorderBrush="{TemplateBinding BorderBrush}"  BorderThickness="{TemplateBinding BorderThickness}" HorizontalAlignment="Center" >
                        <Grid>
                            <!-- ContentPresenter to show an Icon -->
                            <ContentPresenter Margin="0,10,0,35" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
                            <!-- Content for the menu text etc -->
                            <ContentPresenter Margin="0,55,0,0" VerticalAlignment="Top" HorizontalAlignment="Center" ContentSource="Header" RecognizesAccessKey="True" />
                        </Grid>
                    </Border>

                    <!-- These triggers re-configure the four arrangements of MenuItem to show different levels of menu via Role -->
                    <ControlTemplate.Triggers>
                        <!-- Role = TopLevelItem :  this is a child menu item from the top level without any child items-->
                        <Trigger Property="Role" Value="TopLevelItem">
                            <Setter Property="Padding" Value="0"/>
                            <Setter Property="BorderBrush" Value="{x:Null}" />
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="Width" Value="80" />
                            <Setter Property="Height" Value="80" />
                            <Setter Property="HorizontalAlignment" Value="Center" />
                        </Trigger>
                        <!-- Using colors for the Menu Highlight and IsEnabled-->
                        <Trigger Property="IsHighlighted" Value="true">
                            <Setter Property="Background" Value="#FF939498"  />
                        </Trigger>

                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" Value="#FF939498"  />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

这种风格给我的菜单以下的外观

如您所见，菜单中的文本未居中。 我已经尝试了一些解决方案，比如在ContentPresenter中设置TextBlock来设置TextAlignment=“Center”属性，但我不知道如何在TextBlock绑定中获取MenuItem文本

我还尝试将TextBlock.TextAlignment=“Center”属性设置为ContentPresenter，但也不起作用

---

正如你可能看到的，我的菜单还有一个问题。你知道吗，当我把鼠标悬停在菜单项上时，我怎样才能去掉蓝色焦点？正常的悬停样式是菜单将得到浅灰色的颜色，就像在按钮的中间。此外，我的菜单项不使用菜单的全部宽度

我期待着每一个想法

提前谢谢

---

解决方案 bars22给了我正确的提示

我忘了我还有几行深的普通菜单。我只是在看控制模板

以下是我的解决方案：

我离开了菜单项中的样式，并将菜单更改为以下内容：

            <Menu Background="{x:Null}" ItemsSource="{Binding PageViewModels}">
                <Menu.ItemsPanel>
                    <ItemsPanelTemplate>
                        <VirtualizingStackPanel Orientation="Vertical"/>
                    </ItemsPanelTemplate>
                </Menu.ItemsPanel>
                <Menu.ItemTemplate>
                    <DataTemplate>
                        <MenuItem Icon="{Binding Icon}"
                            Command="{Binding DataContext.ChangePageCommand, RelativeSource={RelativeSource AncestorType={x:Type Window}}}"
                            CommandParameter="{Binding }"
                            Style="{StaticResource MenuItem}">
                            <MenuItem.Header>
                                <StackPanel>
                                    <TextBlock TextAlignment="Center" Text="{Binding Name}" />
                                </StackPanel>
                            </MenuItem.Header>
                        </MenuItem>
                    </DataTemplate>
                </Menu.ItemTemplate>
            </Menu>

---

您可以将内容演示者的容器更改为

StackPanel

<StackPanel>
    <!-- ContentPresenter to show an Icon -->
    <ContentPresenter x:Name="Icon" ContentSource="Icon"/>
    <!-- Content for the menu text etc -->
    <ContentPresenter ContentSource="Header" RecognizesAccessKey="True" />
</StackPanel>

---

天啊。。谢谢你给了我正确的暗示。我忘了我还有几行深的普通菜单。我只是在看控制模板。。太蠢了。。。我设置好了，现在可以用了谢谢。。也许你能帮我解决第二个问题？？菜单上的蓝色焦点？您知道如何删除它吗？您可以尝试将

StackPanel

（在我的回答中包含ContentPresenters）的宽度设置为

MenuItem

=“60”。并且应该为图标

ContentPresenter

设置固定的宽度和高度。

<StackPanel>
    <!-- ContentPresenter to show an Icon -->
    <ContentPresenter x:Name="Icon" ContentSource="Icon"/>
    <!-- Content for the menu text etc -->
    <ContentPresenter ContentSource="Header" RecognizesAccessKey="True" />
</StackPanel>

<Menu DockPanel.Dock="Top" Background="white">
    <MenuItem Header="Test">
        <MenuItem Style="{StaticResource MenuItem}">
            <MenuItem.Header>
                <TextBlock Text="Costs Overview" HorizontalAlignment="Center" TextWrapping="Wrap" />
            </MenuItem.Header>
            <MenuItem.Icon>
                <Image Source="/WPFTest;component/Images/Test.png" />
            </MenuItem.Icon>
        </MenuItem>
        <MenuItem Style="{StaticResource MenuItem}">
            <MenuItem.Header>
                <StackPanel>
                    <TextBlock HorizontalAlignment="Center" Text="Costs" />
                    <TextBlock HorizontalAlignment="Center" Text="Overview" />
                </StackPanel>
            </MenuItem.Header>
            <MenuItem.Icon>
                <Image Source="/WPFTest;component/Images/Test.png" />
            </MenuItem.Icon>
        </MenuItem>
    </MenuItem>
</Menu>