How to change the color of hamburger menu icon in Windows - Maui

Vaibhav Methuku 60

Hello,

When ever I add the flyout page in maui, I can able to see the default hamburger menu icon in the windows. I want to remove that icon and my desired icon or please let me know is there any posibility to change the color of the icon.

User's image

FYI - I'm not using shell. Working with .Net 8

Thanks,
Vaibhav Methuku.

Vaibhav Methuku 60 Reputation points

2024-03-28T07:08:54.09+00:00

When we are working with the .net 7, the position of the hamburger menu is below the navigation bar, on upgrading to net 8 It is on the navigation bar, Please find the attached for reference

Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,571 Microsoft Vendor

Please open your App.xaml in Platforms/windows folder. Add <StaticResource x:Key="NavigationViewItemForeground" ResourceKey="SystemControlForegroundBaseHighBrush" /> <SolidColorBrush x:Key="SystemControlForegroundBaseHighBrush" Color="Red" /> to the <maui:MauiWinUIApplication> like following code


<maui:MauiWinUIApplication
    x:Class="MauiRelayCommand.WinUI.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:maui="using:Microsoft.Maui"
    xmlns:local="using:MauiRelayCommand.WinUI">
    <maui:MauiWinUIApplication.Resources>
        <ResourceDictionary>



            <StaticResource x:Key="NavigationViewItemForeground" ResourceKey="SystemControlForegroundBaseHighBrush" />
            <SolidColorBrush x:Key="SystemControlForegroundBaseHighBrush" Color="Red" />

        </ResourceDictionary>


    </maui:MauiWinUIApplication.Resources>

</maui:MauiWinUIApplication>

Vaibhav Methuku 60 Reputation points

2024-03-28T10:10:14.12+00:00

Hi Shanghai,
I had tried with the above piece of code it is working, But, When I hover the cursor, it sets back to black color, how to write a vsm to change color on hover. and also, the position of menu icon got changed, from .Net 7 to Net 8. How to fix this.

Thanks
Vaibhav Methuku.
Vaibhav Methuku 60 Reputation points

2024-04-03T03:30:22.1033333+00:00

Can I have the answer for this, how to change the position of hamburger menu. In net 8
Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,571 Reputation points Microsoft Vendor

2024-04-03T05:13:38.8433333+00:00

Can you share more information about change the position of hamburger menu?

What behavior do you expect, and how is that different from the actual behavior?

May I know if you have got any chance to check my answer in this thread? I am glad to help if you have any other questions.
Vaibhav Methuku 60 Reputation points

2024-04-03T06:44:51.79+00:00

If you can see the attached screen shots above, in the .Net 7 the hamburger menu below the top bar, in the .Net 8 the position of hamburger menu icon is on the navigation bar.
Vaibhav Methuku 60 Reputation points

2024-04-03T06:47:53.29+00:00

If you can see the attached screen shots above, in the .Net 7 the hamburger menu below the top bar, in the .Net 8 the position of hamburger menu icon is on the navigation bar.
Thanniru, Anitha 0 Reputation points

2024-04-04T07:42:52.9+00:00
@Leon Lu (Shanghai Wicresoft Co,.Ltd.) We have tried adding a renderer which is responsible to set the content off on the Nav bar. Here is the code snippet

WindowHandler.Mapper.AppendToMapping(nameof(IWindow), (handler, view) => { if (view.Handler != null) ((MauiWinUIWindow)view.Handler.PlatformView)!.ExtendsContentIntoTitleBar = false; });

This piece of code worked in the Net 7 and appears as below, the Hamburger menu is below

the Nav bar

But in Net8 it's not working and this is how it looks, the Hamburger menu is on the Nav bar
Leon Lu (Shanghai Wicresoft Co,.Ltd.) 68,571 Reputation points Microsoft Vendor

2024-04-04T07:48:52.19+00:00

Thanniru, Anitha Could you open a new thread for this issue? If will help other who have similar issue.