Home > front end >  Xamarin Forms Shell FlyoutItem custom routes
Xamarin Forms Shell FlyoutItem custom routes

Time:03-07

I want to create a Xamarin App that contains 3 pages AboutPage, Page1, Page2. The 3 page are grouped using FlyoutItem as follows:

<FlyoutItem  FlyoutDisplayOptions="AsMultipleItems" >
    <ShellContent Route="AboutPage" Title="About" Icon="icon_about.png"  ContentTemplate="{DataTemplate local:AboutPage}" />
    <ShellContent Route="Page1" Title="Page1" Icon="icon_about.png" ContentTemplate="{DataTemplate local:Page1}" />
    <ShellContent Route="Page2" Title="Page2" Icon="icon_about.png" ContentTemplate="{DataTemplate local:Page2}" />
</FlyoutItem>

I expect the app to land on the AboutPage once started and I want to define the route for Page1 as AboutPage/Page1 and Page2 AboutPage/Page2. Once navigated to Page1 or Page2 from Flyout I want the pages to pushed on top of the AboutPage.

If I used GoToAsync() it works but I have to register the routes

Routing.RegisterRoute("Page1", typeof(Page1));
await Shell.Current.GoToAsync("//AboutPage/Page1");

Can I override Click Event on Flyout to device which path to use? Is there a better solution I am not seing?

CodePudding user response:

Try this way.

 <FlyoutItem ...
                >
        <Tab ...
             Route="AboutPage" >
            <ShellContent ...
                          Route="Page1" />
            <ShellContent ...
                          Route="Page2" />
        </Tab>
       
    </FlyoutItem>

CodePudding user response:

Thanks to WenxuLi-MSFT's comment,

I decided to use his suggestion, I will overrite the onbackpressed Behavior to navigate to the wanted page.

  • Related