Description

The bottom TabBar on Android shows a weird behavior when combining tab pages and flyout navigation (see the second exercise of the Create multi-page .NET MAUI apps with tab and flyout navigation Microsoft Learn module).

When the dark theme is enabled on an Android device and I navigate between flyout pages, where only one of the pages has a bottom tab bar, the bar briefly appears white before changing back to the desired dark theme color.

Is this by design?
This visual inconsistency does not look great from a user perspective.

The same issue also occurs with light theme, when the TabBarBackgroundColor is set to a value different from the default white.

Steps to Reproduce

1. Do File / New Project / MAUI App.
2. Create some additional pages (e.g. SettingsPage, AboutPage) and configure routing.
3. Open AppShell.xaml and create two flyout items, where one item will include tabs and the other a single page:

    <FlyoutItem Title="Main">
        <ShellContent Title="Main"
            ContentTemplate="{DataTemplate local:MainPage}"/>

        <ShellContent Title="Settings"
            ContentTemplate="{DataTemplate local:SettingsPage}"/>
    </FlyoutItem>

    <FlyoutItem Title="About">
        <ShellContent Title="About"
            ContentTemplate="{DataTemplate local:AboutPage}"/>
    </FlyoutItem>

4. Launch the Android application and set the device's dark theme.
5. Open the flyout and navigate between the pages.

Result:

When navigating to the item with multiple tabs, the background of the tab bar briefly appears white before changing to the initial dark color.

Link to public reproduction project repository

https://github.com/richardrigutins/maui-tabbar-color-change-sample

Version with bug

7.0.92

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

Tested on Android 10 and up

Did you find any workaround?

Creating custom ShellRenderer and ShellBottomNavViewAppearanceTracker implementations to remove animations when setting the background color of the bottom navigation view.

Relevant log output

No response