The color of hamburger icon in FlyoutPage always be changed to the white in Maui.

[Jiang-Junjie]

Description

My project is using FlyputPage as follows:

<FlyoutPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:local="clr-namespace:FlyoutPageNavigation"
            x:Class="FlyoutPageNavigation.MainPage">
    <FlyoutPage.Flyout>
        <local:FlyoutMenuPage x:Name="flyoutPage" />
    </FlyoutPage.Flyout>
    <FlyoutPage.Detail>
        <NavigationPage>
            <x:Arguments>
                <local:ContactsPage />
            </x:Arguments>
        </NavigationPage>
    </FlyoutPage.Detail>
</FlyoutPage>

You could see that I set a hamburger.png icon in FlyoutMenuPage:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:FlyoutPageNavigation"
             x:Class="FlyoutPageNavigation.FlyoutMenuPage"
             Padding="0,40,0,0"
             IconImageSource="hamburger.png"
             Title="Personal Organiser">
 //...
       
</ContentPage>

The origin color of hamburger icon is blue, however it always show white when program is running.

Maybe it's a bug of Maui, we need to find a solution to solve this.

Note: We are using .net 7.0 with Visual Studio Community 2022 for Mac Version 17.6.12 (build 410), and running it in iOS 17.3 devices.

Thanks for taking care of this problem in advance.

Steps to Reproduce

No response

Link to public reproduction project repository

No response

Version with bug

Unknown/Other

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

iOS

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

No response

[github-actions]

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one and thumbs upping the other issue to help us prioritize it. Thank you!

Open similar issues:

• Custom Shell FlyoutIcon is all white (#20682), similarity score: 0.81
• Change the flyout icon color (#6738), similarity score: 0.80
• Flyout Page: iOS version doesn't have a native hamburger icon for the flout menu (#15258), similarity score: 0.80
• Flyout Page: IconImageSource doesn't work on Android (#15211), similarity score: 0.78

Closed similar issues:

• Color changes in default project template prevent flyout button from being visible (#21280), similarity score: 0.80

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

[Zhanglirong-Winnie]

This issue has been verified using Visual Studio 17.6.12(build410)(.net7&.net8). Can be reproduced on iOS platform.

[Thaldoras]

NavigationPage has a BarTextColor property. This color is used to recolor the hamburger icon. You can set it to what you want.
Additionally you can use the following method inside your pages to change the icon color
NavigationPage.SetIconColor(this, AppColours.PrimaryDark);

[Jiang-Junjie]

NavigationPage has a BarTextColor property. This color is used to recolor the hamburger icon. You can set it to what you want. Additionally you can use the following method inside your pages to change the icon color NavigationPage.SetIconColor(this, AppColours.PrimaryDark);

Hi, whether you have a try this in FlyoutPage? it not works for me.

[Thaldoras]

Hi, whether you have a try this in FlyoutPage? it not works for me.

Inside "ContactsPage" you can use that method.
Or on your NavigationPage you can set BarTextColor.

var navigationPage = new NavigationPage { BarTextColor = AppColours.PrimaryDark };

Sorry I don't use xaml so don't know how to show it in your code example.