[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Collapse]Ribbon, Bars and Menu
    [Expand]The Ribbon UI
    [Collapse]Visual Elements
      Ribbon Page
      Ribbon Page Group
      Categories and Contextual Tabs
      Quick Access Toolbar
      Page Header Items
      Application Button
      Search Menu
    [Expand]Items and Item Links
     Ribbon Styles
    [Expand]Main Menus
    [Expand]Ribbon Control Designer
    [Expand]Runtime Capabilities
     Known Issues
   [Expand]Popup Menus
    Radial Menu
   [Expand]Common Features
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Ribbon Page Group

A Ribbon Page Group represents a group of bar item links within a Ribbon Page. The following image shows a sample "Home" page which contains five groups: File, Edit, Format, Find and Exit. Each of these groups combines commands that have some features in common.

A Ribbon Page Group is represented by the RibbonPageGroup component. The collection of groups displayed within a page is specified by the RibbonPage.Groups property. You can use this property to add, remove and access specific groups at runtime. To add groups at design time use the RibbonControl's Designer.

For each bar item you can assign large and small icons. Large icons are used by default if there is enough space within a group. However, when the group's region becomes smaller, large icons are automatically replaced with small icons and text is hidden if necessary. If the group's size is reduced so it can no longer display all its links at a time, the group is collapsed (see the Format group in the image above). To prevent a page group from being collapsed, set its RibbonPageGroup.State property to Expanded.

Clicking a collapsed group's Dropdown button invokes the popup which contains the group's contents:

Expanded Bar Item Link Arrangement Rules

There are several bar item link arrangement principles used by the RibbonControl. You will want to familiarize yourself with these principles to better arrange bar item links in your application:

  • For each bar item, which represents a button or sub-menu, you can assign both large and small images. By default, such an item can be displayed using the large image with text, small image with text and small image without text. The BarItem.RibbonStyle property allows you to control which of these options are available.
  • If both large and small images are assigned to a bar item, the large image is used by default (if there is enough space to display it). Small images are used when the group's region is too small to display large images.
  • If a bar item link is represented by a large image, no other link can be displayed above or below it.
  • Only one, two or three bar item links with small images can be arranged vertically within a group.

See Best Practices for tips on arranging bar item links.

Is this topic helpful?​​​​​​​