How to: Use Custom Tab Header Buttons to Switch Tabs

  • 2 minutes to read

This example illustrates methods and events used to manage the selected tabs.

The application uses the DashboardViewer control to load a sample dashboard and show custom buttons in the dashboard title.

Custom buttons are created within the DashboardViewer.CustomizeDashboardTitle event handler. Buttons are the DashboardToolbarItem objects inserted into e.Items collection. The button click event handler is specified in the DashboardToolbarItem constructor. The DashboardToolbarItem's Tag property holds the navigation direction value.

When the end-user clicks a navigation button, the DashboardViewer.GetSelectedTabPageIndex method is used to find the selected page index. Subsequently the index is incremented or decremented depending on the navigation direction and the DashboardViewer.SetSelectedTabPage method selects the next or previous page.

The Slideshow button starts the timer. Each timer tick forces the transition manager to start the animated transition, calls the DashboardViewer.SetSelectedTabPage method to select the next page and finishes the transition.

The Show Tab Headers button toggles the TabContainerDashboardItem.ShowCaption value to hide or show tab captions.

The following code implements tab navigation in the TabContainerDashboardItem control.

View Example: How to navigate tabs using custom tab header buttons or set up a slide show

using DevExpress.DashboardCommon;
using System.Linq;
// ...

enum NextPrevValue {

void ShowNextPrevTab(NextPrevValue value) {
    Dashboard dashboard = dashboardViewer.Dashboard;
    TabContainerDashboardItem tabContainer = dashboard.Items.SingleOrDefault(i => i is TabContainerDashboardItem) as TabContainerDashboardItem;
        if(tabContainer != null) {
            int increment = value == NextPrevValue.Next ? 1 : -1;
            string tabContainerName = tabContainer.ComponentName;
            int selectedIndex = dashboardViewer.GetSelectedTabPageIndex(tabContainerName);
            int pageCount = tabContainer.TabPages.Count;
            dashboardViewer.SetSelectedTabPage(tabContainerName, (selectedIndex + pageCount + increment) % pageCount);