将窗口标题替换为 MahApps.Metro 无边框窗口的菜单

Question

我正在开发一个带有MahApps.Metro 控件的无边框 WPF 窗口应用程序。

我想将我的菜单放在通常窗口标题所在的位置（标题栏的左侧）。如下图：

到目前为止，我得到的如下图所示：

我尝试设置HorizontalAlignment="Left"，但菜单组仍然在标题栏的右侧。

代码：

<Controls:MetroWindow.WindowCommands>        
    <Controls:WindowCommands HorizontalAlignment="Left">
        <Menu IsMainMenu="True" x:Name="mnuMainMenu" Height="28" HorizontalAlignment="Left" VerticalAlignment="Center" FontSize="12" Background="Transparent" Width="Auto" >

            <MenuItem Header="_File" x:Name="mnuFile" Visibility="Visible" Background="Transparent">
                <MenuItem Header="_Open" x:Name="mnuOpen" Background="Transparent" Command="{Binding MenuOpenCommand}" />

                <MenuItem Header="_Exit" x:Name="mnuExit" Click="btnExit_Click" Background="Transparent"/>
            </MenuItem>

            <MenuItem Header="_Tools">
                <MenuItem Header="_Repeat" x:Name="mnuRepete" Background="Transparent" >
                    <MenuItem Header="Repeat None" Command="{Binding RepeatNoneCommand}" IsCheckable="True"/>
                    <MenuItem Header="Repeat One" Command="{Binding RepeatOneCommand}" IsCheckable="True"/>
                    <MenuItem Header="Repeat All" Command="{Binding RepeatAllCommand}" IsCheckable="True"/>
                </MenuItem>
            </MenuItem>

            <MenuItem Header="_Store" x:Name="smOnlineMode" Background="Transparent" Click="smOnlineMode_Click" IsCheckable="True" />
            <MenuItem Header="_Play Mode" x:Name="smPlayMode" Background="Transparent" Click="smPlayMode_Click" IsCheckable="True" IsChecked="True"/>


            <MenuItem Header="_Play">
                <MenuItem Header="_Play" x:Name="mnuPlay" Background="Transparent"  Command="{Binding PlayCommand}"/>
                <MenuItem Header="P_ause" x:Name="mnuPause" Background="Transparent" Command="{Binding PauseCommand}"/>
                <MenuItem Header="_Stop" x:Name="mnuStop" Background="Transparent" Command="{Binding StopCommand}"/>
                <Separator/>
                <MenuItem Header="_Next" x:Name="mnuNext" Background="Transparent" Command="{Binding NextTrackCommand}"/>
                <MenuItem Header="P_revious" x:Name="mnuPrevious" Background="Transparent" Command="{Binding PreviousTrackCommand}" />
                <MenuItem Header="_Mute/UnMute" x:Name="smnuMute" Background="Transparent" Command="{Binding MuteSoundCommand}" />
                <!--Command="{Binding MuteSoundCommand}"-->

            </MenuItem>

            <MenuItem Header="_Help">

                <MenuItem Header="_Help" x:Name="smnuOnlineHelp" Background="Transparent" Click="smnuHelp_Click" />
                <Separator />
                <MenuItem Header="_Register Player" x:Name="smnuRegister" Background="Transparent" Click="smnuRegisterPlayer" />

                <MenuItem Header="_About Codero Music Player" x:Name="smnuAbout" Background="Transparent" Click="smnuAboutClick" />
            </MenuItem>
        </Menu>
    </Controls:WindowCommands>
</Controls:MetroWindow.WindowCommands>

Answer 1

创建StackPanel，将你的菜单放入StackPanel并设置属性HorizontalAlignment=Left或尝试再次使用Margin属性

Answer 2

您必须为自己重新设置 MetroWindow 的样式。满足您需求的最简单方法是创建自定义资源字典并将 MetroWindow.xaml 复制到其中并将以下行更改为 Grid.Column="0"： MetroWindow.xaml

但不要忘记在App.xaml 中加载修改后的资源。

Answer 3

你可以这样做

1. 从标题栏中删除标题
2. 添加MetroWindow.LeftWindowCommands标签
3. 在 LeftWindowCommands 中添加 windows 命令标签
4. 放置一个堆栈面板或网格，并在标题栏中放置您想要的任何内容

代码：

       <controls:MetroWindow.LeftWindowCommands>
          <controls:WindowCommands>
            <StackPanel Name="menuHolder" Orientation="Horizontal">
                <TextBlock Padding="10,5,10,5" Text="My Window"></TextBlock>
                <Menu Name="mymenu" Margin="0,5,0,0">
                    <MenuItem Name="File" Header="File">
                        <MenuItem Name="Open" Header="Open"/>
                        <MenuItem Name="Close" Header="Close"/>
                    </MenuItem>
                    <MenuItem Name="Edit" Header="Edit">
                        <MenuItem Name="Copy" Header="Copy"/>
                        <MenuItem Name="Paste" Header="Paste"/>
                    </MenuItem>
                </Menu>
            </StackPanel>
        </controls:WindowCommands>     

Answer 4

在 MahApps.Metro 1.6.5 中对我有用的解决方案是将 TitleTemplate 依赖属性与主窗口中的 MenuBar 和 Title Textblock 绑定，如下所示：

MainWindow.xaml：

<Controls:MetroWindow
        x:Class="MahAppsMetroDemo.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:MahAppsMetroDemo"
        mc:Ignorable="d"
        Title="ILSpy"
        Height="450" Width="800"
        xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
        Icon="/MahAppsMetroDemo;component/Resources/ILSpy.ico"
    >
    <Controls:MetroWindow.TitleTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>

                <Menu
                    Grid.Column="0"
                    Margin="6,0">
                <MenuItem Name="File" Header="File">
                    <MenuItem Name="Open" Header="Open"/>
                    <MenuItem Name="Close" Header="Close"/>
                </MenuItem>
                <MenuItem Name="Edit" Header="Edit">
                    <MenuItem Name="Copy" Header="Copy"/>
                    <MenuItem Name="Paste" Header="Paste"/>
                </MenuItem>
            </Menu>
                <TextBlock
                    Grid.Column="1"
                    Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type Controls:MetroWindow}},Path=Title}"
                    HorizontalAlignment="Left" VerticalAlignment="Center"
                    Padding="10,5,10,5"
                    Margin="6,0"
                    FontSize="16"
                    FontWeight="Bold"
                    />
            </Grid>
        </DataTemplate>
    </Controls:MetroWindow.TitleTemplate>
    <Grid>

    </Grid>
</Controls:MetroWindow>

MainWindow.cs

namespace MahAppsMetroDemo
{
    using MahApps.Metro.Controls;

    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : MetroWindow
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}