Arvind Chourasiya
Arvind Chourasiya

Reputation: 17462

Xamarin.Forms: How to get Tabbed Page throughout the app

I need to have TabbedPage throughout the app. In the first page Tab's are displaying fine. When I am starting second page From Tab1, It is hiding all tabs. How can I have Tab's all over the app.

First page with tabs Second page without tabs

MainPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage  xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="TabbedApp.MainPage"
             xmlns:local="clr-namespace:TabbedApp">
    <local:DairyTabs></local:DairyTabs>
    <ContentPage Title="Tab 2">
        <StackLayout>
            <Label Text="Tab 2"   
            HorizontalTextAlignment="Center"  
            HorizontalOptions="FillAndExpand"  
            Margin="5" />
        </StackLayout>
    </ContentPage>
</TabbedPage>

This is the code from starting 2nd page

btnDemo.Clicked +=async delegate {
                await Navigation.PushModalAsync(new Page2());
            };

Upvotes: 0

Views: 890

Answers (2)

Fahadsk
Fahadsk

Reputation: 1109

I need to have TabbedPage throughout the app

You must add a NavigationPage as a child page in your TabbedPage in order to open pages inside the tab

So in your Xaml, you can have a NavigationPage inside TabbedPage

<TabbedPage  xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="TabbedApp.MainPage"
             xmlns:local="clr-namespace:TabbedApp">
    <local:PageA/>
    <NavigationPage Title="Your Title">
        <x:Arguments>
            <local:MyPage />
        </x:Arguments>
    </NavigationPage>
</TabbedPage>

Then you can add pages like this

public class MainPageCS : TabbedPage{
    public MainPageCS ()
    {
        var navigationPage = new NavigationPage (new MyPage ());

        navigationPage.Title = "Your title";

        Children.Add (new PageA ());
        Children.Add (navigationPage);
    }
}

So Navigation can be performed from this second page which is a instance of NavigationPage, like below

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

More info in this here

Upvotes: 1

MxStack
MxStack

Reputation: 11

Try to use:

Navigation.PushAsync(new Page2());

Instead of:

Navigation.PushModalAsync(new Page2());

Upvotes: 0

Related Questions