Version

Ribbon Group Layout Panels

The xamRibbon™ control uses three special layout containers within a RibbonGroup to arrange Ribbon tools:

The ToolVerticalWrapPanel and ToolHorizontalWrapPanel containers are responsible for arranging tools based on their current SizingMode property as well as resizing tools when the size of a RibbonGroup changes. On the other hand, the ButtonGroup container’s sole responsibility is to arrange a set of tools into a group of functionally-related tools within a ToolVerticalWrapPanel or a ToolHorizontalWrapPanel.

ToolVerticalWrapPanel

The ToolVerticalWrapPanel is the default layout container used by a RibbonGroup to arrange its tools into columns. The ToolVerticalWrapPanel uses the following rules when arranging its tools:

  • Tools whose SizingMode property is resolved to ImageAndTextLarge are displayed in their own column and span the entire height of the RibbonGroup.

  • Tools whose SizingMode property is resolved to ImageAndTextNormal or ImageOnly are arranged in a column of up to three items. If a column has less than three tools, the ToolVerticalWrapPanel will leave an empty space at the bottom of the column. You can override this default arrangement by setting the ToolVerticalWrapPanel’s VerticalToolAlignment property.

example of xamribbon's group layout panel toolverticalwrappanel

ToolHorizontalWrapPanel

The ToolHorizontalWrapPanel arranges its tools into rows. The default minimum number of rows is two, and the default maximum number of rows is three; however, you can change these defaults by setting the MinRows and MaxRows properties respectively. The ToolHorizontalWrapPanel uses the following rules when arranging its tools:

  • If you set the MaximumSize attached property on a tool to ImageAndTextLarge, the tool will be sorted and displayed at the beginning of the panel. These tools will not participate in resizing and will remain as large tools.

  • Tools whose SizingMode property is resolved to ImageAndTextNormal or ImageOnly will be displayed within a row of the panel.

example of xamribbon's group layout panel toolhorizontalwrappanel

When you resize a RibbonGroup and the panel arranges the tools into more rows than the MinRows property, you can choose to sort the tools by setting the SortOrder attached property. If you do not set the SortOrder attached property on any tool within the panel, the tools will remain in their original order.

ButtonGroup

A ButtonGroup is a specialized layout container that you can use to group one or more tools within the other two layout containers. This is useful for grouping functionally-related tools so that the tools do not get separated within a RibbonGroup when resizing xamRibbon. Any tool that is placed inside a ButtonGroup will have its SizingMode resolved to ImageOnly.

example of xamribbon's group layout panel buttongroup

If we’ve piqued your interest, you can read the following topics to learn much more about xamRibbon’s layout panels.