How to get black text color on .net maui menubar

CFos 0
Viewed 37

I am trying to use a MenuBar in .NET MAUI but the text of the MenuBarItem's are showing as white and I can't seem to change them. Anyone know why they are white or how to change them?

XAML below:

<Shell
x:Class="SnapSignalTel.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:SnapSignalTel"
Shell.FlyoutBehavior="Disabled"
Shell.NavBarIsVisible="True"
Title="{Binding TitleText}"
BackgroundColor="#FFF2F2F2"
>
<Shell.BindingContext>
    <local:MainViewModel />
</Shell.BindingContext>
<Shell.BackButtonBehavior>
    <BackButtonBehavior IsVisible="False" />
</Shell.BackButtonBehavior>
<Shell.MenuBarItems>
    <MenuBarItem Text="File" >
        <MenuFlyoutItem Text="Load" />
        <MenuFlyoutItem Text="Save" />
        <MenuFlyoutItem Text="Exit" />
    </MenuBarItem>
    <MenuBarItem Text="Modes">
    </MenuBarItem>
    <MenuBarItem Text="Help">
    </MenuBarItem>
</Shell.MenuBarItems>

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

The screenshot below shows the toplevel items white (these are the MenuBarItem's). The drop down items are black text though (these are MenuFlyoutItem's)? Weird and can't seem to change them.

enter image description here

Thanks for the help!

maui .net
1 Answers

I received and answer on another platform for this same question. Using a Style as below worked.

<Shell.Resources>
    <Style x:Key="Stylenamehere" TargetType="Element">
        <Setter Property="Shell.BackgroundColor" Value="#FFF2F2F2" />
        <Setter Property="Shell.TitleColor" Value="Black" />
    </Style>
</Shell.Resources>

The above Style is put in the xaml above (in my original post) just below the <Shell ...> tag (so just before the BindingContext tag).

    <ShellContent
    Title=""
    Style="{StaticResource Stylenamehere}"
    ContentTemplate="{DataTemplate local:MainPage}"
    Route="MainPage" />

Then in the <ShellContent... > tag, add the Style as above.

This then allowed me to change the Text of the menu items using "Shell.TitleColor"

I also removed the (BackgroundColor="#FFF2F2F2") attribute in the XAML in the original post (last item in the <Shell ...> tag).

So it now looks like this:

<Shell
x:Class="SnapSignalTel.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:SnapSignalTel"
Shell.FlyoutBehavior="Disabled"
Shell.NavBarIsVisible="True"
Title="{Binding TitleText}">
<Shell.Resources>
    <Style x:Key="SomeStyleName" TargetType="Element">
        <Setter Property="Shell.BackgroundColor" Value="#FFF2F2F2" />
        <Setter Property="Shell.TitleColor" Value="Black" />
    </Style>
</Shell.Resources>
<Shell.BindingContext>
    <local:MainViewModel />
</Shell.BindingContext>
<Shell.BackButtonBehavior>
    <BackButtonBehavior IsVisible="False" />
</Shell.BackButtonBehavior>

<Shell.MenuBarItems>
    <MenuBarItem Text="File" >
        <MenuFlyoutItem Text="Load" />
        <MenuFlyoutItem Text="Save" />
        <MenuFlyoutItem Text="Exit" />
    </MenuBarItem>
    <MenuBarItem Text="Modes">
    </MenuBarItem>
    <MenuBarItem Text="Help">
    </MenuBarItem>
</Shell.MenuBarItems>

<ShellContent
    Title=""
    Style="{StaticResource SomeStyleName}"
    ContentTemplate="{DataTemplate local:MainPage}"
    Route="MainPage" />

</Shell>
CFos0
Related