xamarin.forms - Sub menu items appearing on bottom bar and not within the flyout

Question

I am trying to add a sub menu under my flyout but its placing it on the bottom bar instead for some reason.

addonsflayout.Items.Add(new ShellContent {
            Title = "Airliners",
            Icon = "tab_about",
            Content = new AboutPage()
});

addonsflayout.Items.Add(new ShellContent    {
            Title = "Piston Planes",
            Icon = "tab_about",
            Content = new AboutPage()
});
addonsflayout.Items.Add(new ShellContent    {
            Title = "Turbo Props",
            Icon = "tab_about",
            Content = new AboutPage()
        });

My Main shell flyouts are describe as such

<FlyoutItem Title="Addons" x:Name="addonsflayout" Icon="icon_about.png">
    <ShellContent Route="AddonsPage" ContentTemplate="{DataTemplate local:AddonsPage}" />
</FlyoutItem>

<!-- When the Flyout is visible this will be a menu item you can tie a click behavior to  -->
<MenuItem Text="Logout" StyleClass="MenuItemLayoutStyle" Clicked="OnMenuItemClicked">
</MenuItem>

But its placing them in the bottom bar so it is.

When I want them here

How does one tell it to show for the side menu and not the bottom bar I am using xamrain forms

Edit 2 While adding FlyoutDisplayOptions="AsMultipleItems" does get it to appear its also adding it to the bottom bar and without indentition in the side menu

<FlyoutItem Title="Addons"  FlyoutDisplayOptions="AsMultipleItems" x:Name="addonsflayout" Icon="icon_about.png">
    <ShellContent Route="AddonsPage" ContentTemplate="{DataTemplate local:AddonsPage}" />
</FlyoutItem>

Piston planes should be further in. Also doing this has removed my main menu item addons.

question from:https://stackoverflow.com/questions/65559727/sub-menu-items-appearing-on-bottom-bar-and-not-within-the-flyout

Answer 1

Waitting for answers