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

C#

public class LayoutControlItem :
    ContentItem,
    IUIElement

VB.NET

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

1. Do not combine dock and layout items within a single group.

2. 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).

3. 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.

Example

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.

Window1.xaml

<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>

Related GitHub Examples

The following code snippets (auto-collected from DevExpress Examples) contain references to the LayoutControlItem class.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

C#

wpf-dock-layout-manager-limit-layout-group-customization-at-runtime/CS/DXDockingForLayoutPurposes/MainWindow.xaml#L26

<dxd:LayoutGroup Name="generalLayoutGroup" GroupBorderStyle="GroupBox" ShowCaption="True" Caption="General" Orientation="Vertical">
    <dxd:LayoutControlItem Name="incidentNumber" Caption="Incident Number" VerticalAlignment="Top">
        <dxe:TextEdit/>

wpf-dock-layout-manager-use-data-contexts-for-layout-items-and-their-child-controls/VB/DataContext_Ex/MainWindow.xaml#L31

<dxd:LayoutGroup Orientation="Vertical">
    <dxd:LayoutControlItem Caption="Title">
        <TextBox Text="{Binding Title}"></TextBox>

wpf-docklayoutmanager-build-a-layout-ui/VB/LayoutPanel_Content_Ex/Window1.xaml#L17

              ShowCaption="True">
<dxdo:LayoutControlItem Caption="Title">
    <dxe:TextEdit />

wpf-docklayoutmanager-move-a-layout-item-in-code/CS/DockLayoutManager_MoveItem/Window1.xaml#L5

<dxdo:LayoutGroup Name="Root" Orientation="Vertical">
    <dxdo:LayoutControlItem>
        <Button x:Name="buttonMove" Content="Click to move item" Click="buttonMove_Click" />

how-to-customize-item-appearance-on-the-hidden-items-tab-in-the-customization-window-t345603/VB/ShowHiddenItemsAsTree/MainWindow.xaml#L40

<dxd:LayoutGroup GroupBorderStyle="GroupBox" Caption="Groupbox1" ShowCaption="True" Orientation="Vertical">
    <dxd:LayoutControlItem Caption="Item1">
        <TextBox />

Inheritance

Show 28 items

Object

DispatcherObject

DependencyObject

Visual

UIElement

FrameworkElement

Control

DevExpress.Xpf.Docking.psvFrameworkElement

BaseLayoutItem

ContentItem

LayoutControlItem

ImageDashboardLayoutItem

GridDashboardLayoutItem

GaugeDashboardLayoutItem

DashboardLayoutItem

TreeViewDashboardLayoutItem

TreemapDashboardLayoutItem

TextBoxDashboardLayoutItem

RangeDashboardLayoutItem

PivotDashboardLayoutItem

PieDashboardLayoutItem

MapDashboardLayoutItem

ListBoxDashboardLayoutItem

ChartDashboardLayoutItem

CardDashboardLayoutItem

BoundImageDashboardLayoutItem

ComboBoxDashboardLayoutItem

CustomItemDashboardLayoutItem

Extension Methods

GetErrorOperationCommands(Position)

GetErrorOperationCommands(Int32)

GetErrorOperationCommands(Point)