Navigate to a specific top tab page in Xamarin Shell

845 Views Asked by At

My Xamarin Shell application defines the following FlyoutItem element inside the AppShell.xaml file:

<FlyoutItem ...>
    <ShellContent Title="A" Route="R1" ... />
    <ShellSection Title="B" Route="R2">
        <ShellContent Title="C" Route="R3" ... />
        <ShellContent Title="D" Route="R4" ... />
    </ShellSection>
    <ShellContent Title="D" Route="R5" .../>
    <ShellContent Title="E" Route="R6" ... />
</FlyoutItem>

The behavior I want to obtain is the following:

  • Clicking on the B page, I want the user to be redirected to the C tab of the ShellSection named B (this is the default behavior and works out-of-the-box).
  • Clicking on the D page, I want the user to be redirected to the D tab of the ShellSection named B.

How do I obtain this?

1

There are 1 best solutions below

0
On BEST ANSWER

if you are ok with the following:

If in case the current selected/displayed page is upper tab "D" (Child of bottom tab "B"), and the user click again in bottom tab "B" nothing will happen, navigation will not go to "C", if in case page "A" or "E" is displayed (other than ones belonging to "B" section) and you click on "B" it will displays "C", the same if you click "D" it will displays "D", than this question may help you.

In your Appshell.cs:

public AppShell()
{
...
      InitializeComponent();
      Navigating += Shell_Navigating;
}

private async void Shell_Navigating(object sender, ShellNavigatingEventArgs e)
{
    if (e.Target.Location.OriginalString.Equals("//R5") && e.CanCancel)
    {
        e.Cancel();
        await Shell.Current.GoToAsync("//R2/R4");
    }
}