Title Bar Reappeared on .NET Maui (Blazor Hybrid) app after .NET8 upgrade

144 views Asked by At

I recently upgraded my .NET 6.0 Maui-Blazor Hybrid app to .NET 8.0. We aren't sure exactly when, but my team and I recently noticed that a previously hidden title bar started appearing again. At present, we're only targeting the Windows platform (.net8-windows10.0.19041.0, specifically).

enter image description here

Previously, we had hidden the task bar with this block of code in the App.xaml.cs file that lives within the Platforms/Windows directory. Most of the suggestions I've seen online are either this or very similar lines of code:

public App()
{
 InitializeComponent();

 Microsoft.Maui.Handlers.WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (handler, view) =>
 {
     var mauiWindow = handler.VirtualView;
     var nativeWindow = handler.PlatformView;
     IntPtr windowHandle = WinRT.Interop.WindowNative.GetWindowHandle(nativeWindow);
     WindowId windowId = Win32Interop.GetWindowIdFromWindow(windowHandle);
     AppWindow appWindow = AppWindow.GetFromWindowId(windowId);
     appWindow.Closing += CloseMauiApp;
     var presenter = appWindow.Presenter as OverlappedPresenter;

     presenter.SetBorderAndTitleBar(false, false);
     nativeWindow.ExtendsContentIntoTitleBar = false;

From what I understand, the last two lines caused the app to hide this bar previously. I've also tried setting ExtendsContentIntoTitleBar to true, and that doesn't work either. Another suggestion was to set Shell.NavBarIsVisible="False" in MainPage.xaml. That also didn't work.

My question is: Did anything change in .NET8 that might explain what I'm seeing? I also updated a few NuGET packages alongside the .NET8 upgrade. Here's a list of the NuGET packages used by my project (with the exception of three packages developed by my team that are excluded from this list):

<PackageReference Include="CoralogixCoreNLog" Version="1.1.12" />
<PackageReference Include="MQTTnet" Version="4.3.2.930" />
<PackageReference Include="MudBlazor" Version="6.11.1" />
<PackageReference Include="NetMQ" Version="4.0.1.13" />
<PackageReference Include="NLog" Version="5.2.7" />
<PackageReference Include="NLog.Extensions.Logging" Version="5.3.7" />
<PackageReference Include="NodaMoney" Version="1.0.5" />
<PackageReference Include="QRCoder" Version="1.4.3" />
<PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="8.0.0" />
<PackageReference Include="Newtonsoft.Json" Version="13.0.3" />
<PackageReference Include="Microsoft.Maui.Controls" Version="$(MauiVersion)" />
<PackageReference Include="Microsoft.Maui.Controls.Compatibility" Version="$(MauiVersion)" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="$(MauiVersion)" />

This is a screenshot of the top of the app with the visible title bar. As a side-note, I'm not sure whether this is technically known as the "title bar or something else. I've seen taskbar, AppBar, and NavBar used to describe something similar: enter image description here

1

There are 1 answers

0
jobrien9 On BEST ANSWER

Per the link in Sean He-MSFT's comment, we were able to solve this by moving the relevant code into MauiProgram.cs. This block now exists in MauiProgram.cs:

#if WINDOWS
        builder
        .ConfigureLifecycleEvents(lifecycleEvents =>
        {
            lifecycleEvents.AddWindows(windowsLifecycleBuilder => {
                windowsLifecycleBuilder.OnWindowCreated(Window =>
                {
                    Window.ExtendsContentIntoTitleBar = false;
                    var handle  = WinRT.Interop.WindowNative.GetWindowHandle(Window);
                    var id = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(handle);
                    var appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(id);
                    switch(appWindow.Presenter){
                        case Microsoft.UI.Windowing.OverlappedPresenter overlappedPresenter:
                            overlappedPresenter.SetBorderAndTitleBar(false, false);
                            overlappedPresenter.Maximize();
                            break;
                    }
                });
            });
        });
#endif

The App.xaml.cs file that lives within the Platforms/Windows directory now only contains the code related to the appWindow.Closing += CloseMauiApp; line of code from my original question.

I'm not 100% sure why putting this code in MauiProgram.cs works, but putting it in the App.xaml.cs location does not. However, I'm fine with this solution unless someone is able to explain a way to place it in the other location.