LayoutGroup Class

In This Article

Represents a container that arranges its items side by side (in a single row or column) or as tabs. The LayoutGroup cannot be used outside a LayoutControl.

Namespace: DevExpress.Xpf.LayoutControl

Assembly: DevExpress.Xpf.LayoutControl.v14.2.dll

#Declaration

C#
VB.NET

[StyleTypedProperty(Property = "TabStyle", StyleTargetType = typeof(DXTabItem))]
[StyleTypedProperty(Property = "ItemStyle", StyleTargetType = typeof(LayoutItem))]
[DXToolboxBrowsable(DXToolboxItemKind.Free)]
[StyleTypedProperty(Property = "GroupBoxStyle", StyleTargetType = typeof(GroupBox))]
[StyleTypedProperty(Property = "TabsStyle", StyleTargetType = typeof(DXTabControl))]
public class LayoutGroup :
    LayoutControlBase,
    ILayoutGroup,
    ILayoutControlBase,
    IScrollControl,
    IPanel,
    IControl,
    ILayoutGroupModel,
    ILayoutModelBase,
    ILiveCustomizationAreasProvider,
    ILayoutControlCustomizableItem

<StyleTypedProperty(Property:="TabStyle", StyleTargetType:=GetType(DXTabItem))>
<StyleTypedProperty(Property:="ItemStyle", StyleTargetType:=GetType(LayoutItem))>
<DXToolboxBrowsable(DXToolboxItemKind.Free)>
<StyleTypedProperty(Property:="GroupBoxStyle", StyleTargetType:=GetType(GroupBox))>
<StyleTypedProperty(Property:="TabsStyle", StyleTargetType:=GetType(DXTabControl))>
Public Class LayoutGroup
    Inherits LayoutControlBase
    Implements ILayoutGroup,
               ILayoutControlBase,
               IScrollControl,
               IPanel,
               IControl,
               ILayoutGroupModel,
               ILayoutModelBase,
               ILiveCustomizationAreasProvider,
               ILayoutControlCustomizableItem

#Returned By

Properties and methods that return LayoutGroup instances:

#Remarks

The LayoutGroup.View property specifies how the group's items are displayed - side-by-side or as tabs.

If the property is set to LayoutGroupView.Group or LayoutGroupView.GroupBox, the group's items are arranged in a single row or column, according to the LayoutGroup.Orientation property. The alignment of an item within a group can be adjusted via the item's HorizontalAlignment and VerticalAlignment properties.

In default display mode (LayoutGroupView.Group), a group doesn't display its header. To enable the header, set the LayoutGroup.View property to LayoutGroupView.GroupBox. To specify the object to display in the group's header use the LayoutGroup.Header property.

A LayoutGroup supports the collapsing feature in the LayoutGroupView.GroupBox paint style. You can enable the collapsing feature by setting the LayoutGroup.IsCollapsible property. In this mode, the group displays the collapse/expand button allowing an end-user to collapse/restore the group's contents. To specify the expansion state in code, see LayoutGroup.IsCollapsed.

The following code creates a LayoutGroup with two items. The collapsing feature is enabled via the LayoutGroup.IsCollapsible option:

XAML


<lc:LayoutGroup Orientation="Vertical" View="GroupBox" Header="Layout Group" 
                Width="150" IsCollapsible="True">
    <lc:LayoutItem Label="Item 1">
        <TextBox   Text=""/>
    </lc:LayoutItem>
    <lc:LayoutItem Label="Item 2">
        <TextBox   Text=""/>
    </lc:LayoutItem>
</lc:LayoutGroup>

The result is shown below:

LayoutGroup1

To enable the tabbed UI for a LayoutGroup, set LayoutGroup.View to LayoutGroupView.Tabs. Each child will be represented as a tab.

If another LayoutGroup object is a child of a tabbed group, the corresponding tab header displays the LayoutGroup's LayoutGroup.Header object. For other layout items, you can specify tab headers via the LayoutControl.TabHeader attached property.

The following code creates a tabbed LayoutGroup:

XAML


<lc:LayoutControl x:Name="layoutControl1" Background="#FFEAEAEA">
    <lc:LayoutGroup View="Tabs" Width="200" >
        <lc:LayoutGroup Orientation="Vertical" Header="Tab 1">
            <lc:LayoutItem Label="Item A">
                <TextBox   Text=""/>
            </lc:LayoutItem>
            <lc:LayoutItem Label="Item B">
                <TextBox   Text=""/>
            </lc:LayoutItem>
        </lc:LayoutGroup>
        <lc:LayoutItem Label="Item 2" lc:LayoutControl.TabHeader="Tabbed Item">
            <TextBox   Text=""/>
        </lc:LayoutItem>
    </lc:LayoutGroup>
</lc:LayoutControl>

The result is shown below:

LayoutGroup1_Tabbed

The most common scenario for using the LayoutGroup is within a LayoutControl. Using LayoutGroups you can build compound layouts, as demonstrated in the Layout Control topic.