Hide TabBar in Xamarin Forms Shell
Asked Answered
H

4

16

I wan't to hide the TabBar in a Xamarin Forms Shell 4.0.0.497661 project.

I try using:

Shell.SetTabBarIsVisible(Shell.Current, false);

After the page has loaded and drawed, but it has no effect.

If I put in the codebehind .cs constructor after InitializeComponent(); a null reference exception has launched, but this isn't the problem for me.

How can I hide the TabBar at start or after started?

EDIT:

At last, I have no way to hide bottom bar then... The bottom bar appears when FlyoutItem is included on the Shell, like:

<FlyoutItem Route="animals"
            Title="Animals"
            FlyoutDisplayOptions="AsMultipleItems">

    <ShellContent Route="cats"
                Title="... />

If I remove the FlyoutItem, no bottom bar is displayed.

No other way found to remove it! But it solves my problem.

Harri answered 25/6, 2019 at 7:33 Comment(0)
P
39

TabBarIsVisible is an attached property of Shell. You should pass the page as the first parameter in the SetTabBarIsVisible to tell the shell hiding its tab bar. Use it like:

public AppShell()
{
    InitializeComponent();

    Shell.SetTabBarIsVisible(this, false);
}

You can also place it on any page which you don't need the tab bar.

Peirce answered 26/6, 2019 at 6:30 Comment(0)
R
11

In my case, I need to remove tabbar from child page, then: Shell.TabBarIsVisible="False"

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             Title="Child page from shell"
             Shell.TabBarIsVisible="False"
             x:Class="AppMvvm.Views.User.LoginPage/>
Recorder answered 24/2, 2021 at 19:38 Comment(0)
G
6

Sorry, don't have enough rep. to comment.

In which class are you doing Shell.SetTabBarIsVisible(Shell.Current, false);?

Is it the Shell or Current that is null if you put it after the constructor?

Edit 30/6/2019:

I have tested a few things in Shell. Here's a link to the project: https://github.com/JesperBaltzersen/ShellTest In the class Content1.Xaml.cs there's a button handler that toggles the tabbar:

    public bool NavVisible { get; set; }

    void OnButtonTapped(object sender, EventArgs args)
    {
        NavVisible = !NavVisible;
        Shell.SetNavBarIsVisible(this, NavVisible);
    }

Hope it helps.

Ghibelline answered 25/6, 2019 at 22:1 Comment(1)
In the AppShell, but meybe I have any problem with the Nuget version or something. I solved removing the FlyoutItem and using MenuItem in the Shell.Harri
B
4

Another approach:

<Shell 
X:Class="..............:
xmlns:sd="..................."
Shell.IsTabBarVisible="False">

</Shell>
Boucher answered 18/1, 2021 at 8:59 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.