wpf-devexpress-tab-control

Build WPF tabbed interfaces with DevExpress DXTabControl using views, templates, and data binding.

Updated Dec 11, 2025
One-click install
npx skills add https://github.com/AleksaRistic216/dotnet-playground --skill wpf-devexpress-tab-control-aleksaristic216
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wpf-devexpress-tab-control
Source: https://github.com/AleksaRistic216/dotnet-playground/tree/main/.github/skills/wpf/wpf-devexpress-tab-control
Command: npx skills add https://github.com/AleksaRistic216/dotnet-playground --skill wpf-devexpress-tab-control-aleksaristic216

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires DevExpress.Wpf.Core, and includes references (resource) components.

What problem does it solve? Building tabbed UIs in WPF with the DevExpress DXTabControl involves non-obvious decisions: choosing between static DXTabItem children and ItemsSource data binding, picking the right overflow view (MultiLine, Scroll, Stretch), and avoiding visual artifacts caused by hosting in a plain Window instead of ThemedWindow. This Skill guides you through correct setup and customization. ## Core Features & Use Cases - Tab Definition Patterns: Define tabs explicitly in XAML, add them in code, or generate them from a view-model collection via ItemsSource with ItemHeaderTemplate and ItemTemplate. - Three Overflow Views: Choose TabControlMultiLineView (wrap headers), TabControlScrollView (scroll buttons), or TabControlStretchView (shrink, pin, drag-drop, pop-out windows). - Appearance Customization: Color individual tabs with AccentColor/BorderColor, apply per-state background templates, and add custom content to the tab strip (ControlBoxLeft/RightTemplate) or around content (ContentHeader/FooterTemplate). - Use Case: Build a document workspace where tabs are bound to an ObservableCollection of open documents, closable via AllowHide, cached with TabContentCacheMode, and reorderable via drag-drop in Stretch view. ## Quick Start Ask the AI to create a WPF window using ThemedWindow containing a DXTabControl with three tabs bound to a view-model collection of documents.

Frequently Asked Questions about wpf-devexpress-tab-control

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I bind DXTabControl tabs to a view-model collection?

Set ItemsSource to an ObservableCollection, then define ItemHeaderTemplate for the tab header and ItemTemplate for the page content. Use ItemContainerStyle to set properties like AllowHide and Header on each generated DXTabItem.

Which DXTabControl view should I use for many tabs?

Use TabControlScrollView for a single row with scroll buttons, TabControlMultiLineView to wrap headers into multiple lines, or TabControlStretchView to shrink tab widths. Stretch is the only view supporting drag-drop, pinning, and pop-out windows.

Why does DXTabControl show a double title bar or mismatched colors?

The host window is a plain Window instead of ThemedWindow. Convert MainWindow to dx:ThemedWindow in XAML and update the code-behind class to inherit from DevExpress.Xpf.Core.ThemedWindow for proper visual integration.

Does DXTabControl support drag-drop tab reordering?

Yes, but only in TabControlStretchView. Set DragDropMode to Reorder, DragDrop, OutsideWindow, or All. MultiLine and Scroll views do not support drag-drop.

Why does tab content reload every time I switch tabs?

The default TabContentCacheMode recreates content on each selection. Set TabContentCacheMode to CacheAllTabs or CacheTabsOnSelecting to keep constructed tab content in memory for faster switching.

What .NET versions does the DevExpress WPF tab control support?

DXTabControl supports .NET 6, 7, 8+ and .NET Framework 4.6.2+, targeting Windows only. Install the DevExpress.Wpf.Core NuGet package; a valid DevExpress license is required.