LayoutControl Class

Represents a control container that arranges its items in a single column or row, and allows you to create compound layouts of controls, with the ability to combine the controls into groups and align the controls according to their labels.

Namespace: DevExpress.Xpf.LayoutControl

Assembly: DevExpress.Xpf.LayoutControl.v20.1.dll

Declaration

public class LayoutControl :
    LayoutGroup,
    ILayoutControl,
    ILayoutGroup,
    ILayoutControlBase,
    IScrollControl,
    IPanel,
    IControl,
    ILayoutModelBase,
    ILayoutGroupModel,
    ILiveCustomizationAreasProvider,
    ILayoutControlModel
Public Class LayoutControl
    Inherits LayoutGroup
    Implements ILayoutControl,
               ILayoutGroup,
               ILayoutControlBase,
               IScrollControl,
               IPanel,
               IControl,
               ILayoutModelBase,
               ILayoutGroupModel,
               ILiveCustomizationAreasProvider,
               ILayoutControlModel

Remarks

The LayoutControl container arranges its child items in a single column or row, according to the LayoutGroup.Orientation inherited property. Any types of controls can be added to the LayoutControl container. However, to create compound layouts of controls, you need to combine the controls into LayoutGroups and add the groups as children to the LayoutControl.

The LayoutGroup is a container that arranges its items either side-by-side (in a single column or row) or as tabs. Note that they can display other LayoutGroup objects as children in various orientations. This allows compound layouts to be implemented:

CD_LayoutControl

Unlike its predecessor, the LayoutControl doesn't support a header. So, the LayoutGroup.Header and LayoutGroup.View inherited properties are ignored.

The most common basic element in the LayoutControl is the LayoutItem. This object represents a control consisting of a label and content regions. You can think of the LayoutItem as a wrapper that adds a label to your control. When using LayoutItem objects as wrappers for your controls within a LayoutControl, you benefit from the automatic control alignment feature. To learn more, see Layout Control.

This example demonstrates how to build a compound layout using the LayoutControl.

<Window x:Class="LayoutControl_CompoundLayout.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:lc="http://schemas.devexpress.com/winfx/2008/xaml/layoutcontrol" Title="MainWindow" Height="347" Width="632">

    <Grid x:Name="LayoutRoot" Background="White">
        <lc:LayoutControl Orientation="Vertical" Background="#FFEAEAEA">

            <lc:LayoutGroup Orientation="Horizontal">
                <lc:LayoutGroup Orientation="Vertical">
                    <lc:LayoutItem Label="Item 1:">
                        <TextBox />
                    </lc:LayoutItem>
                    <lc:LayoutGroup Orientation="Horizontal">
                        <lc:LayoutItem Label="Item 2:">
                            <TextBox />
                        </lc:LayoutItem>
                        <lc:LayoutGroup Orientation="Vertical">
                            <lc:LayoutItem Label="Item 3:">
                                <TextBox />
                            </lc:LayoutItem>
                            <lc:LayoutItem Label="Item 4:">
                                <TextBox />
                            </lc:LayoutItem>
                        </lc:LayoutGroup>
                    </lc:LayoutGroup>
                </lc:LayoutGroup>
                <lc:LayoutGroup View="Tabs">
                    <lc:LayoutGroup Header="Tab 1" Orientation="Vertical">
                        <lc:LayoutItem Label="Item 5:">
                            <TextBox />
                        </lc:LayoutItem>
                        <lc:LayoutItem Label="Item 6:">
                            <TextBox />
                        </lc:LayoutItem>
                    </lc:LayoutGroup>
                    <lc:LayoutGroup Header="Tab 2">
                        <lc:LayoutItem Label="Item 7:">
                            <TextBox />
                        </lc:LayoutItem>
                        <lc:LayoutItem Label="Item 8:">
                            <TextBox />
                        </lc:LayoutItem>
                    </lc:LayoutGroup>
                </lc:LayoutGroup>
            </lc:LayoutGroup>
            <lc:LayoutGroup Orientation="Horizontal">
                <lc:LayoutItem Label="Item 9:" HorizontalAlignment="Left">
                    <TextBox Width="100" />
                </lc:LayoutItem>
                <lc:LayoutItem Label="Item 10:">
                    <TextBox />
                </lc:LayoutItem>
                <lc:LayoutItem Label="Item 11:" HorizontalAlignment="Right">
                    <TextBox Width="100" />
                </lc:LayoutItem>
            </lc:LayoutGroup>

        </lc:LayoutControl>
    </Grid>
</Window>

Examples

See Also