Search code examples
.netmaui

How to Remove caption buttons overlay artifact in .NET MAUI targeting windows 11?

I get a visual artifact in caption button area when setting window.ExtendsContentIntoTitleBar to true.

enter image description here

I used the following code in MauiProgram.cs class CreateMauiApp() method.

builder.ConfigureLifecycleEvents(events =>
{
#if WINDOWS
    events.AddWindows(windowsLifecycleBuilder =>
    {
        windowsLifecycleBuilder.OnWindowCreated(window =>
        {
            window.ExtendsContentIntoTitleBar = true;
            window.SystemBackdrop = new DesktopAcrylicBackdrop();
        });
    });
#endif
});
Solution

  • The issue is related to [WinUI 3] Windows App Title Bar Buttons Have Button Shadows in .NET8 after project upgrade from .NET7 #18773. And the issue is that in app title bar where the minimize, maximize, and close buttons have a shadow in WinUI3. You can follow up it.

    As an alternative workaround, you can refer to Title bar still not behaving correctly. Add below code in App.xaml\Windows\Platforms:

    <DataTemplate x:Key="MauiAppTitleBarContainerTemplate">
  <Grid HorizontalAlignment="Stretch">
      <ContentControl
      Grid.Column="4"
      IsTabStop="False"
      HorizontalContentAlignment="Stretch"
      VerticalContentAlignment="Stretch"
      x:Name="AppTitleBarContentControl">
      </ContentControl>
  </Grid>
</DataTemplate>

    Update:

    The issue has been fixed on Visual Studio Enterprise 17.10 Preview 2.0; .NET 8.0.202; Maui 8.0.7.