[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Collapse]Layout Management
   [Expand]Dock Windows
   [Expand]Tile and Layout
   [Collapse]Tab Control
    [Expand]Product Information
    Book Control
    Workspace Manager
  [Expand]Windows Modern UI
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[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)


DXTabControl is designed to bring the tab-based navigation functionality to your applications.

Expanded Tab Control and Items Overview

DXTabControl is a navigation component that is used to build tabbed UI. The layout, style and behavior settings are defined by Views objects. To apply a view to the tab control, create a view object and assign it to the DXTabControl.View property. To learn more about views, see Views.

Tab control's items (pages) are represented by DXTabItem objects that are located in the System.Windows.Controls.ItemsControl.Items collection.

Structurally, each tab item consists of a header and content parts, specified by the DXTabItem.Header and DXTabItem.Content properties respectively. The templates defining the visual representation of the tab item's header and content are specified using the DXTabItem.HeaderTemplate and DXTabItem.ContentTemplate properties. You can specify an icon to be displayed within the tab item's header. To do this, use the DXTabItem.Glyph or DXTabItem.GlyphTemplate property.

Caching Tab Items

The DXTabControl does not cache its tabs by default. Set the DXTabControl.TabContentCacheMode property to TabContentCacheMode.CacheAllTabs to make the DXTabControl load and cache its tab items after the control is shown. Caching tab items can significantly speed up navigation between tabs, but will consume more memory.

Set the DXTabControl.TabContentCacheMode property to TabContentCacheMode.CacheTabsOnSelecting to make the control cache a tab only after it was selected.

Expanded Creating DXTabItems

There are several ways to add tab items to the tab control.

  • Manually create DXTabItem objects and add them to the DXTabControl.Items collection. This can be done in XAML as shown below.

  • Manually add arbitrary objects (data items) to the DXTabControl.Items collection and specify the DXTabControl.ItemTemplate and DXTabControl.ItemHeaderTemplate templates that define how to present tab headers and pages, respectively. In this instance, DXTabItem objects will be generated from data items automatically.

  • Bind the tab control to a data source. To do this, assign a data source to the DXTabControl.ItemsSource property. The control will retrieve data items from the data source and add them to the DXTabControl.Items collection automatically. Similar to the previous case, you should specify the DXTabControl.ItemTemplate and DXTabControl.ItemHeaderTemplate templates to define the tab headers and pages visual presentation.

    To learn more about a binding a tab control to data, see Binding to Data Overview.

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