WPF 添加与标题栏一致的菜单 [英] WPF Add menu in line with title bar

问题描述

我一直在寻找使菜单与标题栏一致的方法，如下图所示.它在最左边有一个标志作为菜单项，其余的文本菜单项在它之后.我只找到了获得类似于第二张图片的菜单的方法，其中菜单位于标题栏下方.如何将菜单与 XAML 中的标题栏保持一致?

I've been searching for ways to get a menu in line with the title bar like the below image. It has the logo on the far left that acts as a menu item and the rest of the text menu items following after it. I've only found ways to get a menu that looks like the second image, where the menu is below the title bar. How can I put the menu in line with the title bar in XAML?

推荐答案

1. 首先在表单中放置一个带有两行的Grid.

将 Menu 放在第一行.

第二行是表格的内容.

在第一行放置一个 DockPanel，在左侧放置一个 MenuDockPanel.Dock = 左"

Place a DockPanel in the first row and a Menu on the left with DockPanel.Dock = "Left"

在设置侧放置 Border 以放置所需的按钮，DockPanel.Dock=Right"

Place a Border on the set side to place the required Buttons with DockPanel.Dock="Right"

以下代码实现上述步骤

<Window x:Class="For_Test.TestWindow"
        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:For_Test"
        mc:Ignorable="d"
         Title="CanvasWindow" Height="450" Width="800" WindowStyle="None" BorderBrush="Gray" BorderThickness="2">
<Window.Resources>
    <Style TargetType="{x:Type local:TestWindow}">
        <Setter Property="WindowChrome.WindowChrome">
            <Setter.Value>
                <WindowChrome CornerRadius="0" GlassFrameThickness="0" ResizeBorderThickness="0" CaptionHeight="0"></WindowChrome>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
    <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <DockPanel Grid.Row="0">
            <DockPanel.Background>
                <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                    <GradientStop Color="#FF454545" Offset="0.528" />
                    <GradientStop Color="#FF555555" Offset="0.01" />
                    <GradientStop Color="#FF454545" Offset="1" />
                    <GradientStop Color="#FF666666" Offset="1" />
                </LinearGradientBrush>
            </DockPanel.Background>
            <Menu Width="Auto" Name="menu1" VerticalAlignment="Top" DockPanel.Dock="Left" Foreground="White" Background="Transparent" Padding="5 5 5 5">
                <MenuItem Header="File" IsCheckable="true" FontSize="12">

                </MenuItem>
                <MenuItem Header="Settings" IsCheckable="true" Foreground="White" FontSize="12">

                </MenuItem>
                <MenuItem Header="Security" IsCheckable="true" Foreground="White" FontSize="12">

                </MenuItem>
                <MenuItem Header="Database" IsCheckable="true" Foreground="White" FontSize="12">


                </MenuItem>
            </Menu>
            <Border HorizontalAlignment="Right" DockPanel.Dock="Right" Padding="5 5 5 5">
                <StackPanel Orientation="Horizontal" FlowDirection="RightToLeft">
                    <Button Content="Colse" Width="50" Foreground="White" Background="Transparent" BorderBrush="#FFDDDDDD" BorderThickness="1"></Button>
                    <Button Content="Minimize" Width="60" Foreground="White" Background="Transparent" BorderBrush="#FFDDDDDD" BorderThickness="1" Margin="5 0 0 0"></Button>
                </StackPanel>
            </Border>
        </DockPanel>
        <StackPanel Grid.Row="1" Background="Blue">
            <TextBlock Text="Content"></TextBlock>
        </StackPanel>
    </Grid>
</Window>

在 TestWindow.cs 中，我将代码通过拖动它放在标题上并关闭应用程序来移动表单.

In TestWindow.cs i put the code to move the form by dragging it on the header and closing the application.

public partial class TestWindow: Window
{
   public TestWindow()
   {
      InitializeComponent();
   }

   private void btnClose_Click(object sender, RoutedEventArgs e)
   {
      Application.Current.Shutdown();
   }

   private void DockPanel_MouseDown(object sender, MouseButtonEventArgs e)
   {
      this.DragMove();
   }
}

注意:设置 WindowStyle=None" 会删除 Windows 标题并为窗口添加额外的边距，通过设置以下代码将其清除.>

Note: Setting WindowStyle="None" removes the Windows header and adds an extra margin to the window, which is cleared by setting the following code.

<Window.Resources>
    <Style TargetType="{x:Type local:TestWindow}">
        <Setter Property="WindowChrome.WindowChrome">
            <Setter.Value>
                <WindowChrome CornerRadius="0" GlassFrameThickness="0" ResizeBorderThickness="0" CaptionHeight="0"></WindowChrome>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

在 TargetType={x: Type local:TestWindow}" 中输入您的窗口名称，而不是上面代码中的 TestWindow.

In TargetType="{x: Type local:TestWindow}" enter your window name instead of TestWindow in the code above.

演示:

这篇关于WPF 添加与标题栏一致的菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！