Can I replicate the ShellSection’s items on the flyout?

Franco Scarpa 21 Reputation points
2020-12-25T23:12:02.033+00:00

I know the Xamarin Shell ShellSection element lets you create a page with multiple top tabs. I want to replicate the same entries on the flyout so that by clicking on one of them, the user navigates to the appropriate top tab. Is this possible?

Xamarin
Xamarin
A Microsoft open-source app platform for building Android and iOS apps with .NET and C#.
5,362 questions
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. JessieZhang-MSFT 7,711 Reputation points Microsoft Vendor
    2020-12-28T08:51:12.813+00:00

    Hello,

    Welcome to our Microsoft Q&A platform!

    Hi @FrancoScarpa-8265,if I understand you correctly, do you want to add a separate menu item for each tab Page in the left Flyout items?

    If yes, you can set the value of property FlyoutDisplayOptions to AsMultipleItems for your Tab.

    You can refer to the following code:

    <FlyoutItem Title="TabPages" Icon="icon_about.png"  Route="test" FlyoutDisplayOptions="AsMultipleItems">  
        <Tab   Title="Tab1"  FlyoutDisplayOptions="AsMultipleItems">  
            <ShellContent Route="AboutPage"   Title="AboutPage" ContentTemplate="{DataTemplate local:AboutPage}" />  
      
            <ShellContent Route="ItemsPage"  Title="ItemsPage"  ContentTemplate="{DataTemplate local:ItemsPage}" />  
        </Tab>  
      
    </FlyoutItem>  
    

    The result is:

    51581-image.png 51562-image.png

    Best Regards,

    Jessie Zhang

    ---
    If the response is helpful, please click "Accept Answer" and upvote it.

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    0 comments No comments

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.