How can I change the background color of the title bar in an android emulator in VS 2022

Question

I'm writting a .NET MAUI solution that is suppose to run on android, and currently has two pages. When I start it up the program runs fine and looks like this:

I also added a Flyout menu which I initially thought wasn't there because the menu lines are displayed in white. When I clicked on the spot where the flyout menu is the new page appeared.

So my question is, how can I initially change the background color of the title bar?

I reviewed videos on how to change background color but was unable to come up with any answers.

Answer 1

I am not sure what the problem is, or what you have tried but to change the NavBar per Page you add Shell.BackgroundColor to your ContentPage:

<ContentPage
    x:Class="MauiTest.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Shell.BackgroundColor="Blue"
    Shell.NavBarIsVisible="True">

The color can also be set through the Shell class

<Shell
    x:Class="MauiTest.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MauiTest"
    BackgroundColor="AliceBlue"
    Shell.FlyoutBehavior="Flyout">