[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
  Prerequisites
 [Expand]What's Installed
 [Expand].NET Core 3 Support
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
   Reporting
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Collapse]Layout Management
   [Expand]Dock Windows
   [Collapse]Tile and Layout
    [Expand]Layout and Data Layout Controls
     Tile Layout Control
     Dock Layout Control
     Flow Layout Control
    [Expand]Common Features
    [Expand]Examples
   [Expand]Tab Control
   [Expand]Carousel
    Book Control
    Workspace Manager
  [Expand]Windows Modern UI
  [Expand]Printing-Exporting
  [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
 [Expand]Localization
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Dock Layout Control

Expanded DockLayoutControl - Arranging items

The DockLayoutControl is an item container that supports the docking functionality. The child items can be docked to the left, top, right or bottom edge or occupy the control's remaining region.

The following image shows a DockLayoutControl with six items docked to the control:

To specify how an item is docked, use the DockLayoutControl.Dock attached property. If an item is docked to a specific edge, it's positioned along this edge within an area not occupied by other items. So, the way items are docked depends on the order in which the items are docked (the order in which the items are listed in the container's Children collection). In the image above, the items are docked in the following order:

  1. Item 1 is docked to the top
  2. Item 2 is docked to the right
  3. Item 3 is docked to the bottom
  4. Item 4 is docked to the left
  5. Item 5 is docked to the top
  6. Item 6 is docked so that it occupies the remaining space

Expanded Resizing Items

You can enable runtime resizing for individual items within a DockLayoutControl. This can be accomplished by using the DockLayoutControl.AllowHorizontalSizing and DockLayoutControl.AllowVerticalSizing attached properties. When resizing is enabled for an item, a sizer is displayed next to the item.

It's possible to temporarily disable item resizing via the DockLayoutControl.AllowItemSizing property.

Expanded See Also

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