How to remove top blue bar on login page?

Issue

Hello I am designing the UI part of a Healthcare Application. I have a login page. When a user enters login button it takes user to the masterpage( I defined it as a welcome page). After doing navigation part of button, suddenly a blue bar appears on the top. How can I disable this blue bar? ( At least I need to remove it from login page, it looks awful) I am adding screenshots how it looks like. Any ideas?

Well, I made LoginPage as a first and I wrote this App.xaml.cs file

"MainPage = new NavigationPage(new LoginPage());" 

Then I just add click event for Signin button in Login.xaml.cs file

async void Button_Clicked(object sender, EventArgs e)
        {await Navigation.PushAsync(new WelcomePage()); }

Then boom this blue bar occurs.

Solution

In your LoginPage Add the following attribute to disable the navigation bar on top:

NavigationPage.HasNavigationBar="False"

Then in your click event I suppose you will need to remove your LoginPage from the navigation stack (If you don't want users to be able to go back to it by clicking the navigation return arrow) you can achieve that by the following:

private async void Button_Clicked(object sender, EventArgs e)
{
    await Navigation.PushAsync(new NextMainPage());
    Navigation.RemovePage(Navigation.NavigationStack[0]); //remove the login page from the stack
}

Answered By - Cfun