FlyoutIcon does not show in alternate theme

[vsfeedback]

This issue has been moved from a ticket on Developer Community.

---

In my brand new, plain vanilla MAUI app, standard flyout icon appears in normal, light windows mode (theme), while in dark mode does not appear. Also, the same application run on my locally connected android phone shows standard flyout icon in dark theme, but not in light theme. Explicitly setting icon with:

FlyoutIcon="{AppThemeBinding Dark=dotnet_bot.png, Light=dotnet_bot2.png}"

helps in dark mode on windows, but still does not work on android in light theme. Everything was done in debug mode (plain F5), and also in release mode on android. Android problem was confirmed on another android phone (of my friend, who prefers light theme) of different make, installed from release .apk file. Nothing helps. Windows 10, updated regularly, latest VS 2022, Samsung A12 android, updated regularly.

---

Original Comments

Feedback Bot on 2/4/2024, 11:43 PM:

(private comment, text removed)

---

Original Solutions

(no solutions)

[ghost]

Hi @vsfeedback. We have added the "s/needs-repro" label to this issue, which indicates that we require steps and sample code to reproduce the issue before we can take further action. Please try to create a minimal sample project/solution or code samples which reproduce the issue, ideally as a GitHub repo that we can clone. See more details about creating repros here: https://github.com/dotnet/maui/blob/main/.github/repro.md

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.

[PureWeen]

are you changing the theme while the app is running?

[gjuwindev]

1. create a new, plain vanilla MAUI project (.NET 8, Win 10, VS 2022 Community)
2. set Shell.FlyoutBehavior="Flyout" (from "Disabled", in AppShell.xaml)
3. debug run that app it on Android phone in dark mode (and see the hamburger icon there)
4. debug run that app it on Android phone in light mode (and the hamburger icon there IS MISSING)

in the meantime, I have found the solution and described it at:

 https://mudrac.ffzg.hr/~pgklada/corner/MissingShellIconOnAndroidInLightTheme.html

but it would be nice if that was not the problem in the plain vanilla MAUI project in the first place... I've spent days trying to find the solution somewhere :-)

[gjuwindev]

additional comment:

that change of foreground color still did not help if I try to use other ways to define Shell.FlyoutIcon, like:

<Shell.FlyoutIcon>
    <!--<FontImageSource 
        FontFamily="OpenSansRegular"
        Glyph="&#x40;"
        ></FontImageSource>-->
    <FileImageSource
        File="dotnet_bot.png"
        ></FileImageSource>
</Shell.FlyoutIcon>

no flyouticon on android in the light theme

[XamlTest]

Verified this on VS 17.10.0 Preview 2.0(8.0.7). Repro on Android 14.0-API34, iOS 17.2 and MacCatalyst, not repro on Windows 11 with below Project:
FlyoutIcon.zip

Issue only happens on Light mode.

Works fine on Dark mode.