Dock Layout Manager
- 5 minutes to read
Overview
To add the docking and/or layout functionalities to a window, you need to use a DockLayoutManager object. It represents a container for dock and layout objects provided by the DXDocking Suite. Various dock and layout objects allow you to:
- Create dock panels, arranging them side-by-side or into a tab container
- Make panels floating and auto-hidden
- Create the tabbed interface for documents, similar to the tabbed interface of MS Visual Studio IDE
Create consistent layouts for your controls (directly within the Dock Layout Manager or within dock panels)
Controls can be arranged side-by-side, using groups. You can display labels for controls and align the controls according to their labels.
Dock and layout objects are added directly or indirectly to the Dock Layout Manager’s root group, which represents the bottom surface of your docking/layout UI. You can think of the root group, as well as about other groups, as a container that arranges child objects either horizontally or vertically. However, a group can have other groups as children. This allows you to create non-linear layouts of dock objects and controls, where a vertical flow of objects is displayed next to a horizontal flow of other objects.
Note
Do not combine dock and layout items within a single group.
Do not combine groups containing dock items with groups containing layout items. If you need to arrange layout items next to dock items, add the layout items into a dock panel (a LayoutPanel object).
Do not use dock items outside the DockLayoutManager control.
Dock Functionality
The DXDocking library provides a set of dock objects, which allow you to implement a complete docking interface:
- Layout (Dock) Panel - Represents a regular dock panel, which can be docked, auto-hidden or floating.
- Layout Group - This is a regular group of objects that arranges its children horizontally or vertically.
- Tabbed Group - A tabbed container of dock panels.
- Document Group - A container that presents child panels (DocumentPanel objects) using the tabbed or MDI UI.
When creating the docking interface, you typically combine dock objects into regular groups (Layout Groups) or tabbed groups (Tabbed Groups). Objects must be combined into regular groups to arrange them next to each other, either vertically or horizontally. Dock objects must be combined into tabbed groups to display them as a single tab container.
Regular and tabbed groups of dock objects can be added to other regular groups, forming a multi-level hierarchy of dock objects. However, the primary parent of all dock objects and groups must be the root group (the DockLayoutManager.LayoutRoot property).
Layout Functionality
You can build layouts of controls directly within the Dock Layout Manager (without a docking interface) or within Layout (Dock) Panels.
The following layout objects are building blocks for creating layouts of your controls:
Layout Control Item - Displays a label next to your control.
When creating a layout, you need to wrap controls with Layout Control Item objects.
Layout Group - This is a regular group of objects that arranges its children horizontally or vertically, or using the tabbed UI.
Layout Groups are used to build the docking and layout interfaces. A Layout Group object can combine either dock or layout objects. However, combining dock and layout objects in the same Layout Group is not allowed.
When building a layout of controls, you combine layout objects into regular groups (Layout Groups). Objects combined into groups are displayed next to each other, either vertically or horizontally. Groups containing layout objects can be added to other groups of layout objects, forming a multi-level hierarchy.
The primary parent of all layout objects is a regular group. If you build the layout of controls within the Dock Layout Manager, the primary parent of all layout objects is the manager’s root group (the DockLayoutManager.LayoutRoot property). If you create a layout within a Layout Panel, the primary parent is the Layout Panel’s Layout Group (the LayoutPanel.Layout property), representing the panel’s content.
Note
Do not combine dock and layout items within a single group.
Do not combine groups containing dock items with groups containing layout items. If you need to arrange layout items next to dock items, add the layout items into a dock panel (a LayoutPanel object).
Do not use dock items outside the DockLayoutManager control.
Docking and Layout Specifics
Visually, the Dock Layout Manager container is rendered as follows. In the center, the content of the manager’s root group is rendered, and along the Dock Layout Manager’s sides, auto-hidden panels are displayed. Floating panels, if any, float over the root group and auto-hidden panels.
In DXDocking, the root group, as well as all other dock and layout objects, must be created manually. The root group is referred to by the DockLayoutManager.LayoutRoot property. When creating a layout in code, you need to assign a regular group (a LayoutGroup object) to the DockLayoutManager.LayoutRoot property. In XAML, you need to declare a LayoutGroup element between the starting and ending DockLayoutManager tags. It will automatically be used to initialize the root group. After a root group has been declared, you can add other dock objects (panels, groups, tabbed groups, etc) to it, or create layout objects, without the docking interface.
Floating, auto-hidden and closed panels are not parts of the root group or any of its children. To create these panels in XAML, use the following collections provided by the Dock Layout Manager: DockLayoutManager.FloatGroups, DockLayoutManager.AutoHideGroups and DockLayoutManager.ClosedPanels.
Note
In XAML, the DockLayoutManager object can only be added as an element to a Window/Page object or Panel class descendants.