Back to Devexpress

LayoutControlItem Class

wpf-devexpress-dot-xpf-dot-docking-478c82df.md

latest10.2 KB
Original Source

LayoutControlItem Class

A Layout Group‘s child element that can display a control with a label.

Namespace : DevExpress.Xpf.Docking

Assembly : DevExpress.Xpf.Docking.v25.2.dll

NuGet Package : DevExpress.Wpf.Docking

Declaration

csharp
public class LayoutControlItem :
    ContentItem,
    IUIElement,
    ILayoutContent
vb
Public Class LayoutControlItem
    Inherits ContentItem
    Implements IUIElement,
               ILayoutContent

Remarks

A LayoutControlItem object can display a UIElement and a label next to it.

View Example: Build a Layout of Controls within LayoutPanels

Use the LayoutControlItem.Control (the content property) and the BaseLayoutItem.Caption properties to specify the item’s child control and label.

The following code sample adds a LayoutControlItem that displays the TextBox control in the application’s layout:

xaml
<Window ...
    xmlns:dxdo="http://schemas.devexpress.com/winfx/2008/xaml/docking">
    <Grid>
        <dxdo:DockLayoutManager>
            <dxdo:LayoutGroup>
                <dxdo:LayoutGroup Orientation="Vertical" CustomizationCaption="Employee">
                    <dxdo:LayoutControlItem Caption="First Name">
                        <TextBox x:Name="frstname" Text="Arnold"/>
                    </dxdo:LayoutControlItem>
                    <dxdo:LayoutControlItem Caption="Last Name">
                        <TextBox x:Name="lstname" Text="Schwartz"/>
                    </dxdo:LayoutControlItem>
                    <dxdo:LayoutControlItem Caption="Department">
                        <TextBox x:Name="dpt" Text="Engineering"/>
                    </dxdo:LayoutControlItem>
                    <dxdo:LayoutControlItem Caption="Position">
                        <TextBox x:Name="pstn" Text="Manager"/>
                    </dxdo:LayoutControlItem>
                    <dxdo:LayoutControlItem Caption="Full Role">
                        <TextBlock>
                            <TextBlock.Text>
                                <MultiBinding StringFormat="{}{0} {1} {2} {3}">
                                    <Binding ElementName="dpt" Path="Text" />
                                    <Binding ElementName="pstn" Path="Text" />
                                    <Binding ElementName="frstname" Path="Text" />
                                    <Binding ElementName="lstname" Path="Text" />
                                </MultiBinding>
                            </TextBlock.Text>
                        </TextBlock>
                    </dxdo:LayoutControlItem>
        </dxdo:DockLayoutManager>
    </Grid>
<Window>

Customize a LayoutControlItem

Caption

Use the BaseLayoutItem.ShowCaption inherited property to specify whether the LayoutControlItem’s caption is visible.

The BaseLayoutItem.CaptionLocation inherited property allows you to specify an item’s caption position.

Specify the BaseLayoutItem.CaptionImage inherited property to display an item’s caption. Use the BaseLayoutItem.CaptionImageLocation inherited property to customize the item’s image location.

Child Control Alignment

The LayoutControlItem object aligns its child control to the left side of the parent LayoutGroup.

LayoutControlItems and LayoutGroup objects inherit the BaseLayoutItem.CaptionAlignMode property that allows you to customize a child control’s alignment.

As an example, you can set the LayoutGroup‘s CaptionAlignMode inherited property to AlignInGroup to enable the local alignment of controls within the LayoutGroup. Set the LayoutControlItem‘s CaptionAlignMode inherited property to AutoSize to minimize the LayoutControlItem‘s caption width and avoid text wrapping.

Limitations

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

  2. Do not combine LayoutGroups that contain dock items with groups that contain layout items. If you need to arrange layout items next to dock items, add the layout items into a LayoutPanel.

  3. Do not use dock items outside the DockLayoutManager control.

  4. Do not add LayoutControlItems in LayoutPanels. Instead, wrap LayoutControlItems with a LayoutGroup and then add the LayoutGroup in a LayoutPanel :

Place the LayoutControlItem objects only inside Layout Groups.

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.

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

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

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

xml
<dxdo:LayoutGroup Name="Root" Orientation="Vertical">
    <dxdo:LayoutControlItem>
        <Button

Inheritance

Show 29 items

Object DispatcherObject DependencyObject Visual UIElement FrameworkElement Control DevExpress.Xpf.Docking.psvFrameworkElement BaseLayoutItem ContentItem LayoutControlItem GaugeDashboardLayoutItem

GridDashboardLayoutItem

ImageDashboardLayoutItem

ListBoxDashboardLayoutItem

RangeDashboardLayoutItem

TextBoxDashboardLayoutItem

TreemapDashboardLayoutItem

TreeViewDashboardLayoutItem

DashboardLayoutItem

ComboBoxDashboardLayoutItem

CustomItemDashboardLayoutItem

DateFilterDashboardLayoutItem

MapDashboardLayoutItem

PieDashboardLayoutItem

PivotDashboardLayoutItem

BoundImageDashboardLayoutItem

CardDashboardLayoutItem

ChartDashboardLayoutItem

See Also

LayoutControlItem Members

Layout UI Items

DevExpress.Xpf.Docking Namespace