Forum Xamarin Xamarin.Forms

Shell Flyout only on one page

I've inherited a Xamarin.Forms app that uses Shell. It has 3 TabbedPage's and uses URL Navigation.
They want to make one of the Tabbed Pages (that only has one tab) into a page with a flyout menu that only has MenuItems in it.
They don't want the flyout menu visible anywhere else in the app.

Here is a portion of the AppShell.xaml...

 <TabBar Route="Main">
    <Tab Route="MainTab">
        <ShellContent ContentTemplate="{DataTemplate local:LoginPage}" Title="Login" Route="Login"/>
    </Tab>
</TabBar>

<TabBar Route="Main2">
    <Tab Route="Main2Tab">
        <ShellContent ContentTemplate="{DataTemplate local:SearchPage}" Title="Search" Route="Search"/>
    </Tab>
</TabBar>

<TabBar Route="Result">
    <Tab Route="Customer">            
        <ShellContent Title="One" Route="One">
            <local:OnePage/>
        </ShellContent>
        <ShellContent Title="Two" Route="Two">
            <local:TwoPage/>
        </ShellContent>
        <ShellContent Title="Three" Route="Three">
            <local:ThreePage/>
        </ShellContent>
    </Tab>
</TabBar>

The page that they want to change to a page with a flyout is //Main2//Main2Tab. How would I go about accomplishing this?

Tagged:

Best Answer

Answers

  • ColeXColeX Member, Xamarin Team Xamurai
    edited March 9

    TabBar is a kind of navigation pattern different from Flyout , we can't use them both in xaml , even we can't place two tabbar into xaml , only the first one would work .

    Shell Flyout only on one page

    Possible workaround

    Change the flyout icon in OnNavigating depending on the route path in AppShell .

         void OnNavigating(object sender, ShellNavigatingEventArgs e)
            {
                if(e.Target.Location.OriginalString.Contains("Main2"))
                {
                    this.FlyoutIcon = "transparent .png";        //transparent icon 
                }
                else
                {
                    this.FlyoutIcon = "hamburger .png";    //hamburger icon 
                }
            }
    
  • DonMesserli.1843DonMesserli.1843 USMember ✭✭

    If I put that OnNavigating in AppShell.xaml.cs, it is never called.

Sign In or Register to comment.