Bar Actions

  • 5 minutes to read

The bar actions allow you to change existing ribbons, toolbars, and menus in the DevExpress (like Spreadsheet, RichEdit, and others) controls and your custom UserControls.

The bar actions allow you to make the following changes:

  • add new elements
  • replace the existing elements
  • remove default elements
  • update properties for the existing elements.

Element Actions

Bar actions implement the IControllerAction interface. All actions have the Execute method that implements the action's functionality. When a list of actions is executed, the Execute method is called for every action, in the order defined by the list.

The following classes implement the IControllerAction interface and you can use them as actions:

The table below lists the available scenarios for the elements mentioned above.




Adds/inserts a Bar to any of the following collections:

BarItem class descendants


BarItemLinkBase class descendants

Adds/inserts an element to any of the following collections:


Adds/inserts an element to the RibbonControl.Categories collection.


Adds/inserts an element to the RibbonPageCategoryBase.Pages collection.


Adds/inserts an element to the RibbonPage.Groups collection.

You can configure the bar actions with the following attached properties:




Use this property to specify the name of the container to which you want to add an element.

For example, to add an additional RibbonPageCategory to the diagram's ribbon, set this property to the DefaultBarItemNames.Ribbon as follows:

    CollectionAction.ContainerName="{x:Static dxdiag:DefaultBarItemNames.Ribbon}">
    <!-- -->


Specifies the container to which a collection action adds an element.

Use this property if you have access to the container instance.


Use this property to specify the zero-based index at which an element should be inserted.


A container can have multiple collections of the required type. Use this property to specify a collection to which the bar action is applied.

Use this property when you add a BarItem or BarItemLink object to the RibbonControl or RibbonStatusBarControl.

For example, to add a BarButtonItem to the RibbonControl.PageHeaderItems collection, set the CollectionAction.CollectionTag property to the PageHeaderItems value:

    CollectionAction.ContainerName="{x:Static dxdiag:DefaultBarItemNames.Ribbon}" 
    CollectionAction.CollectionTag="PageHeaderItems" /> 

You can find the full list of the supported collection tags in the RibbonCollections enumeration.

Collection Actions

The bar actions include the CollectionAction to modify collections of Ribbon, Toolbars, and Menus.

You can use collection actions to insert, remove or replace an item in the collection.

The table above lists the attached CollectionAction properties. The table below describes the CollectionAction properties used to modify collections:




Specifies the kind of the action. You can choose one of the following values:

  • Insert
  • Remove
  • Replace

You can use the CollectionAction class descendants to make your markup more clear:


Specifies the name of an element which you want to add to a container.


Use this property to specify the element to which you want to add a container. The InsertAction and ReplaceAction use the Element property as their content property:

<dxb:InsertAction ...>
    <dxb:BarButtonItem ... />

Update Action

You can use the UpdateAction to modify CLR or dependency property values of Ribbon, Toolbars, and Menus.

For example, use this action to change item headers or bind their properties to your ViewModel.

The following table lists the UpdateAction's properties:




Specifies a name of an element which property the UpdateAction changes.


Specifies an element which property the UpdateAction changes. Use this property if you have access to an element instance.


Specifies a dependency property the UpdateAction changes:

<dxb:UpdateAction Property="{x:Static dxb:BarButtonItem.ContentProperty}" ... />


Specifies the name of the CLR or dependency property the action changes.

The UpdateAction uses the Reflection API to set value for the property specified in this way.


Sets a value the action applies to the updated property.


Sets a data binding the action applies to the updated dependency property specified by the UpdateAction.Property property.

The binding uses the inheritance context of an element that is specified by this UpdateAction.

Execute Actions

Execute Bar Actions With Built-In Properties

The controls that contain built-in ribbon, toolbars, and menus provide properties useful to define bar actions, such as:

In most cases, you can use the built-in control *Customizations property to customize the toolbars, ribbon, and menu.


Refer to the following GitHub example for information on how to customize built-in menus: How to access and remove rows by using a custom cell's context menu.

Execute Bar Actions With ControllerBehavior

Use the ControllerBehavior to execute bar actions in custom conditions:





Specifies how to execute the bar actions: manually, on event, or on associated object changing.


Use this property to specify when to trigger the behavior.


A collection of actions executed by the behavior.

The code sample below demonstrates how to perform the following actions when the Loaded event occurs:

  • Insert the MyNewlyAddedButton button into the File menu item.
  • Remove the Edit menu item.
  • Add the MyNewlyAddedButton button to the toolbar.
<Window x:Class="ControllerBehaviorSample.MainWindow" 
        Title="ControllerBehaviorSample" Height="350" Width="525">
                <dxb:ControllerBehavior ExecutionMode="OnEvent">
                        <dxb:ActionTrigger EventName="Loaded" ExecuteOnce="True"/>
                        <dxb:InsertAction ContainerName="biFile">
                                Glyph="{dx:DXImage Image=Cut_16x16.png}" 
                                LargeGlyph="{dx:DXImage Image=Cut_32x32.png}"/>
                        <dxb:RemoveAction ElementName="biEdit"/>
                        <dxb:InsertAction ContainerName="ToolBar">
                                Glyph="{dx:DXImage Image=New_16x16.png}" 
                                LargeGlyph="{dx:DXImage Image=New_32x32.png}"/>

The image below illustrates the result.