Blazor UI Components - New Menu (Available now in v20.2.5)

ASP.NET Team Blog
28 January 2021

In this post, I'll discuss our new Menu component available as part of the DevExpress UI for Blazor (v20.2.5).

New Menu

Our Menu for Blazor allows you to add an adaptive menu to your Blazor application. Blazor Menu items are stored in the Items collection. Each item can display an icon, text, or both.

DevExpress Blazor Menu

Orientation

The Menu's default orientation is Horizontal (menu items are side-by-side). Use the Orientation property to change the menu to Vertical (menu items are stacked).

DevExpress Blazor Menu Vertical

Adaptive

The DisplayMode property allows you to optimize component layout based on device type:

  • Desktop – Use this mode for devices with large screens.
  • Mobile – Use this mode for mobile devices.
  • Auto – In this mode, the component adapts to device type automatically.

DevExpress Blazor Menu - Adaptive

The CollapseItemToIconMode, CollapseItemToHamburgerMenu, and AdaptivePriority properties allow you to fine-tune adaptive mode to address specific business needs.

DevExpress Blazor Menu - Adaptive

Templates

Our Blazor Menu component allows you to customize the layout and appearance of menu items and associated elements via templates. You can apply a template to all items or to an individual item. Individual templates override common templates.

DevExpress Blazor Menu - Templates

Feedback

Leave a comment below and let us know how you're using our Blazor Layout components in your web applications.

FREE DevExpress Xamarin UI Controls

Deliver high-impact native mobile apps with our feature-rich Data Grid, Scheduler, Chart, TabView, Editors, and utility controls. Reserve your free copy today!