Navigation bar overlaps title bar when replacing MainPage for a maui Windows App

[SophisticatedConsulting]

Description

When an application transfers a login page to an AppShell page the title bar overlaps the Windows title bar:

Application.Current.MainPage = new AppShell();

This is a common scenario for many applications.

This has not worked in any previous maui versions or with the current .NET 7 RC1.

Steps to Reproduce

1. Start with the maui Flyout Shell demo: ShellFlyOutSample
2. Add a new xaml page named Login.xaml and replace the content:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ShellFlyoutSample.Login"
             Title="Login">
    <ContentPage.Content>
        <StackLayout>
            <Label Text="Please login"
                VerticalOptions="CenterAndExpand" 
                HorizontalOptions="CenterAndExpand" />
            <Button Text="Login" 
                Clicked="Button_Clicked"
                HorizontalOptions="Center" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

3. Add to the code behind:

        private void Button_Clicked(object sender, EventArgs e)
        {
            Application.Current.MainPage = new AppShell();
        }

5. Replace the start-up page in the app.xaml.cs code behind:
   MainPage = new NavigationPage(new Login());
6. Run the app as a Windows app. The navbar and title appear correctly for the Login page. When you click on the Login button and replace the main page the navbar and page title overlap window title bar (see screen shot above)

Link to public reproduction project repository

See above

Version with bug

6.0.486 (current)

Last version that worked well

Unknown/Other

Affected platforms

Windows

Affected platform versions

Windows SDK 10.0.22000.0

Did you find any workaround?

No.
I tried not extending the app content into the Windows TitleBar (adding the code below to Platform/Windows/app.xaml.cs constructor):

        Microsoft.Maui.Handlers.WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (h, v) =>
        {
            (v.Handler.PlatformView as MauiWinUIWindow).ExtendsContentIntoTitleBar = false;
        });

This results in the TitleBar being clean but then the page title overlaps the flyout menu hamburger button.

Relevant log output

No response

[ghost]

Hi @SophisticatedConsulting. We have added the "s/try-latest-version" label to this issue, which indicates that we'd like you to try and reproduce this issue on the latest available public version. This can happen because we think that this issue was fixed in a version that has just been released, or the information provided by you indicates that you might be working with an older version.

You can install the latest version by installing the latest Visual Studio (Preview) with the .NET MAUI workload installed. If the issue still persists, please let us know with any additional details and ideally a reproduction project provided through a GitHub repository.

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

[SophisticatedConsulting]

Yes, the issue also occurs with the latest version of VS Preview 17.4 Preview 3 and MAUI 7.0.0 RC1.
(This is what I am running for dev... I took the off the shelf sample app as a simple way to reproduce the issue.)

[PureWeen]

Duplicate of #10573

[SophisticatedConsulting]

Yes... resolved with VS 17.4 Preview 4, MAUI RC2.

[SophisticatedConsulting]

Resolved with VS Preview 17.4 Preview 4.0 and MAUI 7.0.0 RC2
Thanks!