Unable to programmatically set color of Shell icon in .Net 9 when FlyoutBehavior is disabled

[kevinjohnobrien]

Description

Prior to upgrading to .Net 9, I was able to programmatically change the color of a Shell icon using the following code in AppShell.xaml.cs:

MainPage.Icon = new FontImageSource
{
    FontFamily = "FASolid",
    Glyph = "\uf130",
    Color = Colors.GreenYellow
};

When using Shell.FlyoutBehavior="Disabled" with the following code, it results in the colors not being updated, but instead uses the colors set in Styles.xaml (which I think was an issue before):

<TabBar 
    CurrentItem="{Reference MainPage}">
    <ShellContent
        Title="Main"
        x:Name="MainPage"
        ContentTemplate="{DataTemplate local:MainPage}"
        IsVisible="True">
    </ShellContent>
    <ShellContent
        Title="Main2"
        x:Name="MainPage2"
        ContentTemplate="{DataTemplate local:MainPage}"
        IsVisible="True">
    </ShellContent>
</TabBar>

However, when using Shell.FlyoutBehavior="Flyout", the colors work fine...

<ShellContent
    Title="Main"
    x:Name="MainPage"
    ContentTemplate="{DataTemplate local:MainPage}"
    Route="MainPage" />

<ShellContent
    Title="Main2"
    x:Name="MainPage2"
    ContentTemplate="{DataTemplate local:MainPage}"
    Route="MainPage" />

Have recreated issue in iOS simulator and MacCatalyst.

Steps to Reproduce

1. Create a new Maui App
2. Add the following code to AppShell.xaml.cs (there's no need to add a reference to FontAwesome, the colors still show in the "not found" icon):

public partial class AppShell : Shell
{
    public AppShell()
    {
        InitializeComponent();
        
        MainPage.Icon = new FontImageSource
        {
            FontFamily = "FASolid",
            Glyph = "\uf130",
            Color = Colors.GreenYellow
        };
        
        MainPage2.Icon = new FontImageSource
        {
            FontFamily = "FASolid",
            Glyph = "\uf130",
            Color = Colors.RosyBrown
        };
    }
}

Update AppShell.xaml to replace the ShellContent with:

<ShellContent
    Title="Home"
    x:Name="MainPage"
    ContentTemplate="{DataTemplate local:MainPage}"
    Route="MainPage" />

<ShellContent
    Title="Home2"
    x:Name="MainPage2"
    ContentTemplate="{DataTemplate local:MainPage}"
    Route="MainPage" />

3. Run, and you'll notice the colors of the two option's icons in the flyout are correctly set to those defined in the code.

4. Next, update the AppShell.xsml so Shell.FlyoutBehavior="Disabled"
5. Then replace the ShellContent with:

<TabBar 
    CurrentItem="{Reference MainPage}">
    <ShellContent
        Title="Main"
        x:Name="MainPage"
        ContentTemplate="{DataTemplate local:MainPage}"
        IsVisible="True">
    </ShellContent>
    <ShellContent
        Title="Main2"
        x:Name="MainPage2"
        ContentTemplate="{DataTemplate local:MainPage}"
        IsVisible="True">
    </ShellContent>
</TabBar>

3. Run, and you'll notice the colors of the two option's icons in the flyout are no longer set to those defined in the code.

Link to public reproduction project repository

No response

Version with bug

9.0.10 SR1

Is this a regression from previous behavior?

Yes, this used to work in .NET MAUI

Last version that worked well

8.0.40 SR5

Affected platforms

iOS, macOS

Affected platform versions

Tested on iPhone simulators: 15 Plus (iOS 17.0) & 15 Pro (iOS 17.5)

Did you find any workaround?

No response

Relevant log output

[similar-issues-ai]

We've found some similar issues:

• Unable to set flyout burger menu icon color in Shell when customized with FontImageSource  #24857 , similarity score: 84%
• .NET MAUI set AppShell custom FlyoutIcon display problem #25920 , similarity score: 82%
• [9.0] [iOS] [Regression] - ToolbarItem color when used with IconImageSource is always white. #25912 , similarity score: 82%

If any of the above are duplicates, please consider closing this issue out and adding additional context in the original issue.

Note: You can give me feedback by 👍 or 👎 this comment.

[Zhanglirong-Winnie]

This issue has been verified Visual Studio Code 1.96.2 (9.0.22 & 9.0.10). Can repro this issue on iOS platform. On 8.0.40 works fine.