Forum› Xamarin.Forms
Shell Flyout only on one page
DonMesserli.1843
USMember ✭✭✭
USMember ✭✭✭
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?
0
Best Answer
-
ColeX
Member, Xamarin Team Xamurai
Did you assign the method in AppShell?
public AppShell() { InitializeComponent(); this.Navigating += OnNavigating; }5
Answers
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 .
Possible workaround
Change the flyout icon in
OnNavigatingdepending 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 } }If I put that OnNavigating in AppShell.xaml.cs, it is never called.
Did you assign the method in AppShell?
public AppShell() { InitializeComponent(); this.Navigating += OnNavigating; }