.NET 8 MAUI Toolbar Transparency and Disappearance Issue

[doriangh]

Description

When upgrading a .NET MAUI application from .NET 7 to .NET 8, the toolbar behavior changes unexpectedly. In .NET 7, the toolbar correctly displays the app's principal color. However, in .NET 8, the toolbar becomes transparent, and the text turns light gray. Additionally, in my specific application, the toolbar completely disappeared post-upgrade.

Steps to Reproduce

1. Create a new .NET MAUI app using .NET 7
2. Create a second page, set the MainPage as new NavigationPage(new MainPage());
3. Open app and observe toolbar
4. Upgrade app to .NET 8
5. Launch and observe toolbar

Link to public reproduction project repository

No response

Version with bug

8.0.0

Is this a regression from previous behavior?

Yes, this used to work in .NET MAUI

Last version that worked well

7.0.101

Affected platforms

Android

Affected platform versions

No response

Did you find any workaround?

Using the ToolbarHandler to change the background works. However it has no effect on my other app (even though it does reach)

Relevant log output

No response

[PureWeen]

@doriangh I think this is caused by the styles now being applied correctly in NET8

If you delete these styles from the Styles.xaml file then it uses the default android material colors.

Though I do think we need to pick better defaults here.

    <Style TargetType="NavigationPage">
        <Setter Property="BarBackgroundColor" Value="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource OffBlack}}" />
        <Setter Property="BarTextColor" Value="{AppThemeBinding Light={StaticResource Gray200}, Dark={StaticResource White}}" />
        <Setter Property="IconColor" Value="{AppThemeBinding Light={StaticResource Gray200}, Dark={StaticResource White}}" />
    </Style>

[ghost]

Hi @doriangh. We have added the "s/needs-info" label to this issue, which indicates that we have an open question for you before we can take further action. 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.

[doriangh]

That is true, removing those did have the behavior that .net 7 had.

However, without changing anything, my app which had a toolbar in .net 7, suddenly doesn't have one. I quickly created two apps (one with .net 7 and one with .net 8) to get an explanation for the issue, and when I saw that there's no toolbar, I opened the ticket.

Though the styles were at fault in the demo app, I still cannot seem to get the toolbar in my application. I am modifying the TitleTextAppearance using the AppendToMapping in ToolbarHandler, and it's crucial to my app. For the purpose of this test, I have removed that. But it just doesn't come up. I have changed the default common styles for the toolbar, I have commented out any styled I had in the Android platform folder, and the behavior is the same.

In the ToolbarHandler, if I append to mapping the VirtualView as IsVisible = true, it does show up, but does not have the correct style (from the common styles.xaml file).

ToolbarHandler.Mapper.AppendToMapping("Toolbar", (handler, toolbar) =>
{
#if ANDROID
      handler.VirtualView.IsVisible = true;
#endif
});

TitleViews don't seem to appear as well.

I'll try to pinpoint the issue.

[ghost]

Hi @doriangh. We have added the "s/needs-info" label to this issue, which indicates that we have an open question for you before we can take further action. 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.

[doriangh]

@PureWeen I've found a way to reproduce the issue. My app uses absolute navigation, and that's where the issue is.
Here's a repo with two solutions, one with .NET 7, one with .NET 8. I have a flyout page as the MainPage, where it has defined as the Detail a NavigationPage, with the MainPage as the content. In the constructor of MainPage I've hidden the NavigationBar. In the constructor of the SecondPage I've set the NavigationBar to visible.
When I replace the Detail of the Flyout (absolute navigation to second page), the NavigationBar comes up in the SecondPage in .NET7, but is still hidden in .NET8.

Here's the repo: https://github.com/doriangh/Maui-Android-Toolbar-Issue/

[PureWeen]

@doriangh thank you for following up!!

Can you validate against our nightly builds?
https://github.com/dotnet/maui/wiki/Nightly-Builds

I tested your repro and it looks like it was fixed by
#18684

[doriangh]

@PureWeen I can confirm that the issue is solved using the latest nightly build. I am also glad to see that one other issue I had, regarding long titles in navigation pages, where the text would be truncated to only 3 letters on android, is also fixed.