NOV Blazor WebAssembly Ribbon

The NOV Ribbon for Blazor WebAssembly is a control for implementing Ribbon command interface, similar to the Microsoft Office "ribbon" user interface, in your web applications. The Ribbon is fully customizable and scales its child widgets automatically based on the available area. The resizing of the Ribbon is fully customizable, too.
The NOV Blazor WebAssembly Ribbon consists of the following main elements:

• Application Menu - contains application specific menu options and buttons, equivalent to the File menu in traditional menu based UIs.
• Ribbon Tab - the main part of a ribbon. Contains the tab pages of the ribbon, the application menu, the ribbon collapse button and the top right content of the ribbon.
• Collapse Button - a button that can be used to collapse/expand the ribbon widgets. When the ribbon is collapsed, the content of its tab pages is not visible.
• Additional Content - the content next to the collapse button. This most commonly is a help button, but can be any widget.
• Ribbon Group - the main building block of a ribbon tab page. The ribbon group is the container in which ribbon buttons, menus, split buttons, galleries, combo boxes and other widgets are placed.
• Dialog Launcher - a button in the header of a ribbon group, which when clicked opens a dialog window that contains additional information and settings related to the ribbon group.
• Ribbon Wrap Flow Panel - places widgets on two or three lanes.
• Ribbon Stack Panel - groups several widgets together. This panel is typically used in a ribbon wrap flow panel in order to prevent a set of widgets to break on several lanes.
• Ribbon Button - extends the regular buttons with support for ribbon widget states and large and small images.
• Ribbon Split Button - extends the regular split buttons with support for ribbon widget states and large and small images.
• Ribbon Menu - extends the regular drop down menus with support for ribbon widget states and large and small images.
• Ribbon Gallery - represents a scrollable list of items, each of which shows visually the result of clicking it.

Click here to review the main parts of the NOV Blazor WebAssembly Ribbon Control

Main parts of the NOV Blazor WebAssembly Ribbon Control.

The Blazor WebAssembly Ribbon Application Menu contains application specific menu options and buttons, equivalent to the File menu in traditional menu based UIs.

The Ribbon Tab is the main part of a ribbon. It contains the tab pages of the ribbon, the application menu, the ribbon collapse button and the top right content of the ribbon.

The Ribbon group is the main building block of a ribbon tab page. It is the container in which ribbon buttons, menus, split buttons, galleries, combo boxes and other widgets are placed. A ribbon group typically has 4 states: Large, Medium, Small and Collapsed.

NOV Ribbon dynamically resizes its content when the size of the ribbon changes. The order in which groups shrink to smaller states or collapse is completely configurable by assigning priorities to the states of the groups.

NOV Ribbon is styled with CSS. NOV initially comes with the following themes: Windows 8, Windows 7, Windows XP Blue, Windows Classic (with all color scheme variations) and Mac Lion.