How to remove top blue bar on login page?

Question

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.

Can you share a bit of of xaml specifically which type is your LoginPage? Is it the first page called in your `App.xaml.cs`? Or you are wrapping it into a `NavigationPage` or using using `Shell` container? — Cfun, Nov 14 '20 at 15:28

score 3 · Accepted Answer · answered Nov 14 '20 at 16:05

3

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 Nov 14 '20 at 16:05

Cfun

8,442
4
30
62

I get a error like "System.InvalidOperationException: 'PushAsync is not supported globally on Android, please use a NavigationPage.'" – vitaminJava Nov 14 '20 at 18:19
check this https://stackoverflow.com/q/24621814/5228202, I don't know why you are getting this since you are using NavigationPage in your App.xaml.cs – Cfun Nov 14 '20 at 18:22
I guess the problem is my stack starts from LoginPage which is defined as an MainPage at App.xaml.cs . So when I remove that page from stack, compiler confuses about beginning haha – vitaminJava Nov 14 '20 at 19:08
I ran the same simulation like yours and it works fine, the important thing is that you run `PushAsync()` before `RemovePage()`. – Cfun Nov 14 '20 at 19:11
@burakzbc Regarding your initial question, does setting `NavigationPage.HasNavigationBar="False"` made the blue bar disappear ? – Cfun Nov 14 '20 at 19:14
Yes I tried only that part and works by own. Removing part is a bit tricky I think. I replace the lines and get still same problem – vitaminJava Nov 14 '20 at 19:23
1

I will update in case I will find something meanwhile you can try to upgrade XF version if not the latest just a guess. – Cfun Nov 14 '20 at 19:25

How to remove top blue bar on login page?

1 Answers1