The Hamburger Menu
The Hamburger Menu has a long history. It was introduced by Norm Cox in the early 1990s as a part of the user interface for the Xerox Star, but became much more popular in the last decade when mobile app developers were looking for ways to accommodate complex user interfaces on small mobile phone screens. The Hamburger Menu has become a universal UI element: three stacked horizontal bars are instantly recognized by end users today as “the main menu”. The metaphor is widely used in web and desktop applications, including modern UWP ones. For example, here’s a screenshot from a Microsoft Store “Mail” app:
With our v18.1 release, the Hamburger Menu makes its way into the WinForms controls suite. Since our WinForms package already included lots of navigation and menu controls, we decided to extend existing feature sets rather than add a new control.
We integrated the Hamburger Menu in our Accordion Control: Set the ViewType property to HamburgerMenu and the Accordion Control supports a collapsed state where it mimics the behavior of Windows 10 apps and shows a narrow strip of icons.
Depending on the property OptionsHamburgerMenu.DisplayMode, the Hamburger Menu expands in three different modes. In Overlay mode, the expanded Accordion is drawn on top of the neighboring content.
Expanding the Hamburger Menu with the Inline mode applied forces the adjoining content to squeeze, making way for the Accordion.
Finally, the option Minimal is similar to Overlay when the menu is expanded, but it reminds of mobile devices when the Accordion Control collapses, leaving the Hamburger Menu button as the only visible control part.
Navigation Pane Support
The Accordion Control has been a useful modern replacement for the original Navigation Bar ever since we first introduced it. It has several important advantages — in a nutshell, in case you have missed out so far:
- Rich item header customization capabilities, enabling custom controls element-specific context buttons
- DirectX rendering with support for visual effects like Acrylic (this will be available in v18.1)
- An intuitive object hierarchy with
AccordionElementobjects as the only child elements used by the control - A modern appearance with visually minimalistic items
However, the early Accordion Control didn’t support the Navigation Pane View, a well-known navigation bar view inspired by Outlook and commonly used in modern applications.
In the upcoming v18.1 release, the Accordion Control now supports the Navigation Pane appearance, in the latest style shown in Microsoft UWP applications. To enable it, simply switch the EnablePaneFooter property to true.
As always, your feedback counts
Tell us what you think! Do you see these features making their way into your future projects? How do you feel about the Hamburger Menu in classic desktop apps?
Before I let you go, just a quick question - are you guys using 24/7 app monitoring services such as Logify? Our support team plans on using Logify with some of our enterprise customers and we’d love to know what you guys think of 24/7 app monitoring.