Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

How to: Add Bar Items to the Tab Header Area

  • 2 minutes to read

You can display custom buttons in-line with tab headers. The buttons can be aligned near to the tab headers (left aligned) or near to the ribbon edge (right aligned).

Ribbon_PageHeaderItemLinks

To display a custom button in the tab header area:

In the Ribbon Simple Pad demo, the ribbon displays the Share button aligned to the right. The example below shows how to add the Backward and Forward buttons.

using DevExpress.XtraBars;

BarButtonItem itemBackNav = RibbonControl1.Items.CreateButton("Backward");
itemBackNav.ImageIndex = 10;
itemBackNav.VisibleInSearchMenu = false;
itemBackNav.Alignment = BarItemLinkAlignment.Left;
itemBackNav.ItemClick += new ItemClickEventHandler(itemBackNav_ItemClick);
BarButtonItem itemFrwNav = RibbonControl1.Items.CreateButton("Forward");
itemFrwNav.ItemClick += new ItemClickEventHandler(itemFrwNav_ItemClick);
itemFrwNav.ImageIndex = 11;
itemFrwNav.VisibleInSearchMenu = false;
itemFrwNav.Alignment = BarItemLinkAlignment.Left;
RibbonControl1.PageHeaderItemLinks.AddRange(new BarItem[] { itemBackNav, itemFrwNav});

void itemFrwNav_ItemClick(object sender, ItemClickEventArgs e) {
    //...
}

void itemBackNav_ItemClick(object sender, ItemClickEventArgs e) {
    //...
}