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.v20.1.dll

Declaration

public class HamburgerMenu :
    ContentControl,
    ISupportSelection,
    INavigationOwner,
    IHamburgerMenu
Public Class HamburgerMenu
    Inherits ContentControl
    Implements ISupportSelection,
               INavigationOwner,
               IHamburgerMenu

Remarks

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

Hamburger Menu Items

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

<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>

See the Hamburger Menu topic for more information.

See Also