Back to Devexpress

HamburgerMenu Class

wpf-devexpress-dot-xpf-dot-windowsui-0f7a9670.md

latest7.8 KB
Original Source

HamburgerMenu Class

Represents a collapsible navigation menu that displays a stack of navigation buttons. Supports regular buttons, sub-menus, hyperlinks, check and radio buttons.

Namespace : DevExpress.Xpf.WindowsUI

Assembly : DevExpress.Xpf.Controls.v25.2.dll

NuGet Package : DevExpress.Wpf.Controls

Declaration

csharp
[DXLicenseWpf]
public class HamburgerMenu :
    ContentControl,
    ISupportSelection,
    INavigationOwner,
    IHamburgerMenu
vb
<DXLicenseWpf>
Public Class HamburgerMenu
    Inherits ContentControl
    Implements ISupportSelection,
               INavigationOwner,
               IHamburgerMenu

The following members return HamburgerMenu objects:

Remarks

The image below shows the main menu, the bottom bar, and buttons of the Hamburger Menu.

The XAML snippet below illustrates how to define ThemedWindow that uses a Hamburger Menu for navigation.

xaml
<dx:ThemedWindow x:Class="DXApplication1.MainWindow"
                 xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                 xmlns:dxwui="http://schemas.devexpress.com/winfx/2008/xaml/windowsui"
                 xmlns:dxwuin="http://schemas.devexpress.com/winfx/2008/xaml/windowsui/navigation"
                 xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
                 xmlns:local="clr-namespace:DXApplication1"
                 mc:Ignorable="d"
                 Title="MainWindow">
    <dxwui:HamburgerMenu OpenPaneWidth="200"
                         SelectedItem="{Binding HamburgerMenuSelectedItem, Mode=TwoWay}"
                         NavigationTarget="{Binding ElementName=service}">
        <dxwui:HamburgerMenu.Content>
            <dxwui:NavigationFrame Source="{x:Type local:Home}">
                <dxmvvm:Interaction.Behaviors>
                    <dxwuin:FrameNavigationService x:Name="service"/>
                </dxmvvm:Interaction.Behaviors>
            </dxwui:NavigationFrame>
        </dxwui:HamburgerMenu.Content>
        <dxwui:HamburgerMenuNavigationButton Glyph="Icons/Home.png" Content="Home" NavigationTargetType="{x:Type local:Home}"/>
        <dxwui:HamburgerMenuItemSeparator/>
        <dxwui:HamburgerSubMenu Content="Menu" Glyph="Icons/Menu.png">
            <dxwui:HamburgerSubMenu.Items>
                <dxwui:HamburgerSubMenuNavigationButton Content="MenuSubItem 1" PreviewContent="PreviewItem 1" ShowInPreview="True" SelectOnClick="False" RightContent="RC"/>
                <dxwui:HamburgerSubMenuNavigationButton Content="MenuSubItem 2" PreviewContent="PreviewItem 2" ShowInPreview="True" SelectOnClick="False"/>
                <dxwui:HamburgerSubMenuNavigationButton Content="MenuSubItem 3"/>
                <dxwui:HamburgerSubMenuNavigationButton Content="MenuSubItem 4" ShowPreviewMark="True"/>
            </dxwui:HamburgerSubMenu.Items>
        </dxwui:HamburgerSubMenu>
        <dxwui:HamburgerMenuHyperlinkButton NavigateUri="https://www.devexpress.com/" Content="More information..." Placement="Bottom"/>
        <dxwui:HamburgerMenuNavigationButton NavigationTargetType="{x:Type local:About}" Content="About" Placement="Bottom" Glyph="Icons/About.png"/>
        <dxwui:HamburgerMenu.BottomBarItems>
            <dxwui:HamburgerMenuBottomBarNavigationButton NavigationTargetType="{x:Type local:Settings}" Glyph="Icons/Settings.png" Placement="Right"/>
            <dxwui:HamburgerMenuBottomBarRadioButton GroupName="Radio" Glyph="Icons/Radio1.png"/>
            <dxwui:HamburgerMenuBottomBarRadioButton GroupName="Radio" Glyph="Icons/Radio2.png"/>
            <dxwui:HamburgerMenuBottomBarCheckBox Glyph="Icons/Check.png"/>
        </dxwui:HamburgerMenu.BottomBarItems>
    </dxwui:HamburgerMenu>
</dx:ThemedWindow>

Use the navigation button’s NavigationTargetType (or NavigationTargetTypeName) property to specify the Page class to be opened when a user clicks the menu item. The NavigationTargetParameter property specifies the navigation parameter to pass to the target page.

The HamburgerMenu is a container that stores the default NavigationFrame. If you want to use the HamburgerMenu with another control, place this control inside the HamburgerMenu.Content property:

xaml
<dxwui:HamburgerMenu>
    <dxwui:HamburgerMenu.Content>
        <dxg:GridControl>
            <!-- ... -->
        </dxg:GridControl>
    </dxwui:HamburgerMenu.Content>

    <dxwui:HamburgerMenuNavigationButton .../>
    <!-- ... -->
</dxwui:HamburgerMenu>

Refer to the following help topic for more information: Hamburger Menu.

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the HamburgerMenu class.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

wpf-mvvm-behaviors-hamburger-based-theme-selector/CS/HamburgerSubMenuThemeSelectorBehavior/MainWindow.xaml#L12

xml
<Grid>
    <dxwui:HamburgerMenu>
        <dxwui:HamburgerSubMenu>

Inheritance

Object DispatcherObject DependencyObject Visual UIElement FrameworkElement Control ContentControl HamburgerMenu

See Also

HamburgerMenu Members

DevExpress.Xpf.WindowsUI Namespace