How to change the background color of wpf window title bar. I used the following code, but it didnt work. I cannot see the close button when i change the color of the grid.
Current
Wanted
<Style x:Key="StandardStyle" TargetType="{x:Type Window}">
<Setter Property="WindowChrome.WindowChrome">
<Setter.Value>
<WindowChrome />
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Window}">
<Grid Background="Yellow">
<Border
Margin="50"
>
<ContentPresenter Content="{TemplateBinding Content}"/>
</Border>
<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Title}"
VerticalAlignment="Top" HorizontalAlignment="Left"
Margin="36,8,0,0" Foreground="Red"/>
<Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Icon}"
VerticalAlignment="Top" HorizontalAlignment="Left"
Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(WindowChrome.WindowChrome).ResizeBorderThickness}"
Width="100"
WindowChrome.IsHitTestVisibleInChrome="True"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
CodePudding user response:
When you extend your own content into the non-client area of a window using the WindowChrome
class, you should define custom captions button yourself:
<Style x:Key="StandardStyle" TargetType="{x:Type Window}">
<Setter Property="WindowChrome.WindowChrome">
<Setter.Value>
<WindowChrome UseAeroCaptionButtons="False" />
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Window}">
<Grid Background="Yellow">
<Border
Margin="50"
>
<ContentPresenter Content="{TemplateBinding Content}"/>
</Border>
<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Title}"
VerticalAlignment="Top" HorizontalAlignment="Left"
Margin="36,8,0,0" Foreground="Red"/>
<Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Icon}"
VerticalAlignment="Top" HorizontalAlignment="Left"
Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(WindowChrome.WindowChrome).ResizeBorderThickness}"
Width="100"
WindowChrome.IsHitTestVisibleInChrome="True"/>
<Button Content=""
WindowChrome.IsHitTestVisibleInChrome="True"
HorizontalAlignment="Right" VerticalAlignment="Top"
Command="{x:Static ApplicationCommands.Close}">
<Button.Style>
<Style TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<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"
Foreground="#999999" HorizontalAlignment="Center" VerticalAlignment="Center"
RenderOptions.ClearTypeHint="Auto" TextOptions.TextRenderingMode="Aliased" TextOptions.TextFormattingMode="Display"/>
</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>
</Setter.Value>
</Setter>
</Style>
</Button.Style>
</Button>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
You also need to implement the command/event handler(s): https://stackoverflow.com/a/61784021/7252182