[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].NET Core 3 Support
 [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
   [Collapse]Dock Windows
    [Expand]Getting Started
    [Expand]Dock Items
    [Expand]Layout Items
    [Expand]Runtime Features
     [Collapse]Dock Functionality
       How to build dock UI according to MVVM pattern using IMVVMDockingProperties interface
       How to build dock UI according to MVVM pattern using LayoutAdapter
       How to create a complex layout of dock panels
       How to create a DocumentGroup with two tabs
       How to create a TabbedGroup and DocumentGroup groups
       How to create auto-hidden panels
       How to create closed (hidden) panels
       How to create floating panels in XAML
       How to customize a panel's context menu via actions
       How to dock a panel to another panel in code
       How to embed a bar into a dock panel
       How to enable MDI mode for a DocumentGroup
       How to: Associate a Command Provided by the DXDocking Library with a Button
       How to: Load an External Window or UserControl into a DocumentPanel
     [Expand]Layout Functionality
   [Expand]Tile and Layout
   [Expand]Tab Control
    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)

How to create a complex layout of dock panels

This example shows how to create a complex layout of dock panels, by combining the panels into LayoutGroups. The following Layout Groups are created:

- RootGroup (arranges LayoutGroup1 and LayoutGroup3 horizontally)

- LayoutGroup1 (arranges LayoutGroup2 and TabbedGroup vertically)

- LayoutGroup2 (arranges three LayoutPanels horizontally)

- LayoutGroup3 (arranges two LayoutPanels vertically).

The following image shows the created structure of dock panels:

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