How I set header and footer to FlyoutPage ?

דני שטרית 1,181 Reputation points

How I set header and footer to FlyoutPage ?

FlyoutPage xmlns=""
IsPresented="True" >

<!-- This is the panel that flies out from the side. You can make it stay open by setting "IsPresented=True"-->
<FlyoutPage.Flyout >
    <views:MenuPage x:Name="MyMenuPage" />

<!-- The 'Detail' page means the main part of the app. -->
    <!-- We will use a NavigationPage as the root of the detail area. This will let you navigate to LoginPage/MainPage/HistoryPage/etc  -->
    <NavigationPage NavigationPage.HasNavigationBar="False">
            <views:DashboardPage />


A Microsoft open-source framework for building native device applications spanning mobile, tablet, and desktop.
1,841 questions
{count} votes

1 answer

Sort by: Most helpful
  1. Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 22,331 Reputation points Microsoft Vendor

    Hello @דני שטרית ,

    Usually, we can set Flyout header and footer by setting <Shell.FlyoutHeader> and <Shell.FlyoutFooter>. I noticed that you are using FlyoutPage , and set the MenuPage as the flyout.
    FlyoutPage is incompatible with .NET MAUI Shell apps, and an exception will be thrown if you attempt to use FlyoutPage in a Shell app, refer to

    So, you have to add a customized control in your MenuPage, so that it looks like the header and footer.

    Best Regards,
    Wenyan Zhang

    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
    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