A MenuItem adds an action to a .NET MAUI Shell flyout. Unlike a FlyoutItem, which takes the user to a page or group of pages, a MenuItem runs functionality that should be available across the app. A logout action is a typical use: it executes logout logic rather than navigates somewhere. section 7.5.1
Place MenuItem elements inside Shell after enabling the flyout with FlyoutBehavior="Flyout". Give each item visible text and, when helpful, an icon. Tapping or clicking the item can invoke either its Clicked event handler or its Command, letting the action live in code-behind or in a binding context. section 7.5.1 section 7.5.3
Choose the Shell element by what the flyout entry should do:
- Use MenuItem for functionality such as logging out; it is not a route to an app page. section 7.5.1
- Use FlyoutItem to expose a page or a group of pages. A FlyoutItem can contain multiple children. section 7.5.1
- Use Shell sections and tabs to organize pages within navigable areas of the app. section 7.5.1
Menu items can share a consistent appearance through Shell.MenuItemTemplate. The template receives each item as its binding source, so a layout can bind an Image to Icon and a Label to Text. One template applies to every MenuItem in that Shell, making it useful when the flyout has several actions. section 7.5.3
Add a Logout action to a Shell flyout
Enable the flyout, then add a logout item before Shell closes: <Shell FlyoutBehavior="Flyout"> ... <MenuItem Text="Logout" IconImageSource="icon_logout.png" /> </Shell> At this stage it supplies the visible action. Wire Clicked or Command when the logout behavior is ready, and use Shell.MenuItemTemplate to refine the icon-and-label layout. section 7.5.3 section 7.5.1
Figure 7.13 The flyout menu in Shell consists of a customizable header and footer, flyout items for navigating the app, and menu items for executing code.
The flyout diagram places menu items alongside navigation items and its customizable header and footer, clarifying their distinct roles. section 7.5.1
