wpf - 如何使用 WindowChrome 在 WPF 自定义标题栏上显示默认按钮

Question

我正在关注文章Restyle Your Window，其中作者将标题栏上的最大化按钮显示为 character #。但我想向它显示一个默认按钮，如下所示：

目前我的自定义标题栏如下所示：

问题：我们如何修改下面的xaml来实现上面的？我在想可能是我们只需要修改以下标签：

<Button x:Name="btnRestore" Click="MaximizeRestoreClick" Content="#"
                                    DockPanel.Dock="Right" WindowChrome.IsHitTestVisibleInChrome="True" />

MyWindowStyle.xaml：

<ResourceDictionary x:Class="WPFtest.WindowStyle"
                    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
                    xmlns:local="clr-namespace:WPFtest">

    <Style x:Key="CustomWindowStyle" TargetType="{x:Type Window}">
        <Setter Property="WindowChrome.WindowChrome">
            <Setter.Value>
                <WindowChrome CaptionHeight="30" CornerRadius="4" GlassFrameThickness="0" NonClientFrameEdges="None" ResizeBorderThickness="5" UseAeroCaptionButtons="False" />
            </Setter.Value>
        </Setter>
        <Setter Property="BorderBrush" Value="Black" />
        <Setter Property="Background" Value="Gray" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Window}">
                    <Grid>
                        <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="5,30,5,5">
                            <AdornerDecorator>
                                <ContentPresenter />
                            </AdornerDecorator>
                        </Border>

                        <DockPanel Height="20" VerticalAlignment="Top" LastChildFill="False">
                            <TextBlock Margin="5,0,0,0" VerticalAlignment="Center" DockPanel.Dock="Left" FontSize="12" Foreground="White"
                                       Text="{TemplateBinding Title}" />

                            <Button x:Name="btnClose" Click="CloseClick" Content="X" DockPanel.Dock="Right"
                                    WindowChrome.IsHitTestVisibleInChrome="True" />

                            <Button x:Name="btnRestore" Click="MaximizeRestoreClick" Content="#"
                                    DockPanel.Dock="Right" WindowChrome.IsHitTestVisibleInChrome="True" />

                            <Button x:Name="btnMinimize" VerticalContentAlignment="Bottom" Click="MinimizeClick"
                                    Content="_" DockPanel.Dock="Right" WindowChrome.IsHitTestVisibleInChrome="True" />
                        </DockPanel>

                    </Grid>

                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

Answer 1

当您定义自定义 chrome 窗口样式时，您无法显示默认按钮，但您可以轻松地设置自定义按钮的样式，使其看起来像默认按钮。

使用我在这里Segoe MDL2 Assets建议的字体系列：

<Button x:Name="btnMinimize" Content="&#xE949;"
                Padding="0 1 1 0"
                VerticalContentAlignment="Bottom"
                Click="MinimizeClick" DockPanel.Dock="Right"
                WindowChrome.IsHitTestVisibleInChrome="True">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Grid x:Name="LayoutRoot" Background="Transparent" Width="44" Height="30">
                <TextBlock x:Name="txt" Text="{TemplateBinding Content}"
                                   FontFamily="Segoe MDL2 Assets"
                                   FontSize="10" 
                                   HorizontalAlignment="Center" VerticalAlignment="Center"
                                   RenderOptions.ClearTypeHint="Auto"
                                   TextOptions.TextRenderingMode="Aliased"
                                   TextOptions.TextFormattingMode="Display"
                                   Margin="{TemplateBinding Padding}"/>
            </Grid>
            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter TargetName="LayoutRoot" Property="Background" Value="#E5E5E5"/>
                    <Setter TargetName="txt" Property="Foreground" Value="#000000"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
</Button>