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

Replace Window title with Menu for MahApps.Metro borderless Window

提问by autopilot

I'm developing a border less WPF window application with MahApps.Metrocontrol.

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

I want to have my menu where normally the window title goes (Title bar's left side). Like below image:

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

What I have got so far looks like below image:

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

I have tried setting HorizontalAlignment="Left", but the menu group remains on the right side of the title bar.

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

Code for this:

代码：

<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>

回答by Sony

You can do something like this

你可以做这样的事情

1. Remove the title from the title bar
2. Add a MetroWindow.LeftWindowCommandstag
3. Add windows command tag inside LeftWindowCommands
4. Place a stackpanel or grid and place what ever you want in the title bar

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

Code:

代码：

       <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>     

回答by StepUp

Create StackPanel, put your menu into StackPaneland set the property HorizontalAlignment=Leftor try to use Margin property again

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

回答by Michael Mairegger

You have to restyle the MetroWindow for your own. The easiest way for your needs would be to create a custom resource dictionary and copy the MetroWindow.xaml into it and change following line to Grid.Column="0": MetroWindow.xaml

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

But do not forget to load that modified resource in App.xaml.

但是不要忘记将修改后的资源加载到App.xaml.

回答by user8276908

The solution that works for me in MahApps.Metro 1.6.5 is to bind the TitleTemplate dependency property with the MenuBar and Title Textblock in the Main Window as shown below:

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

MainWindow.xaml:

主窗口.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

主窗口.cs

namespace MahAppsMetroDemo
{
    using MahApps.Metro.Controls;

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