LayoutControlItem Class
An element of a Layout Group, capable of displaying a control with a label.
Namespace: DevExpress.Xpf.Docking
Assembly: DevExpress.Xpf.Docking.v18.2.dll
Declaration
public class LayoutControlItem :
ContentItem,
IUIElement
Public Class LayoutControlItem
Inherits ContentItem
Implements IUIElement
Remarks
A LayoutControlItem object can display an external control, and a label next to the control. The item's control and label are specified by the LayoutControlItem.Control and BaseLayoutItem.Caption properties, respectively. You can position the label at any edge of the control (via the BaseLayoutItem.CaptionLocation property) or hide the label (via the BaseLayoutItem.ShowCaption property).
LayoutControlItem objects are used to build layouts of controls within Layout Groups, and therefore Layout Panels. To build a layout, combine LayoutControlItems into LayoutGroups, according to your arrangement requirements.
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.
NOTE
LayoutControlItem objects are not designed to be used outside Layout Groups.
See Layout Control Items to learn more.
Examples
This example shows how to arrange controls within LayoutPanels forming a custom layout.
The following image shows the result of the XAML execution:
NOTE
A complete sample project is available at https://github.com/DevExpress-Examples/how-to-build-a-layout-of-controls-within-layoutpanels-e1848.
<Window x:Class="LayoutPanel_Content_Ex.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
xmlns:dxdo="http://schemas.devexpress.com/winfx/2008/xaml/docking"
Title="DockLayoutManager">
<dxdo:DockLayoutManager Name="dockLayoutManager1">
<dxdo:DockLayoutManager.LayoutRoot>
<dxdo:LayoutGroup Name="Root">
<dxdo:LayoutPanel Caption="Panel1">
<dxdo:LayoutGroup Orientation="Vertical">
<dxdo:LayoutGroup Caption="Personal info"
GroupBorderStyle="GroupBox"
Orientation="Vertical"
ShowCaption="True">
<dxdo:LayoutControlItem Caption="Title">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
<dxdo:LayoutGroup ItemHeight="Auto">
<dxdo:LayoutControlItem Caption="First name">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
<dxdo:LayoutControlItem Caption="Last name">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
</dxdo:LayoutGroup>
</dxdo:LayoutGroup>
<dxdo:LayoutGroup Caption="Notes"
GroupBorderStyle="GroupBox"
ShowCaption="True">
<dxdo:LayoutControlItem Caption="Notes"
ShowCaption="False">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
</dxdo:LayoutGroup>
</dxdo:LayoutGroup>
</dxdo:LayoutPanel>
<dxdo:LayoutPanel Caption="Panel2">
<dxdo:LayoutGroup Caption="Address info"
GroupBorderStyle="GroupBox"
Orientation="Vertical"
ShowCaption="True">
<dxdo:LayoutGroup ItemHeight="Auto">
<dxdo:LayoutControlItem Caption="Country">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
<dxdo:LayoutControlItem Caption="Region">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
</dxdo:LayoutGroup>
<dxdo:LayoutGroup ItemHeight="Auto">
<dxdo:LayoutControlItem Caption="City">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
<dxdo:LayoutControlItem Caption="Postal code">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
</dxdo:LayoutGroup>
<dxdo:LayoutControlItem Caption="Address">
<dxe:TextEdit />
</dxdo:LayoutControlItem>
</dxdo:LayoutGroup>
</dxdo:LayoutPanel>
</dxdo:LayoutGroup>
</dxdo:DockLayoutManager.LayoutRoot>
</dxdo:DockLayoutManager>
</Window>