AccordionItem.ItemDisplayMode Property

Gets or sets the display mode of the current accordion item. This is a dependency property.

Namespace: DevExpress.Xpf.Accordion

Assembly: DevExpress.Xpf.Accordion.v21.1.dll

Declaration

public ItemDisplayMode ItemDisplayMode { get; set; }

Property Value

Type Description
ItemDisplayMode

An ItemDisplayMode enumeration value that specifies the display mode of an accordion item.

Available values:

Name Description
Default

The accordion item‘s margins are calculated based on the hierarchy level. The item processes mouse input and keyboard navigation.

Header

The accordion item directly renders the content of the header. Margin calculation and mouse processing are bypassed. The glyph and expand button are disabled.

Remarks

You can set the AccordionItem.ItemDisplayMode property to Header to replace the current accordion item with the object its AccordionItem.Header property specifies. In this mode, the glyph and expand-collapse button are disabled, and the item’s margins are ignored.

The following code sample demonstrates the AccordionControl that displays two items with different display modes:

AccordionItems0

<Window ...
        xmlns:dxa="http://schemas.devexpress.com/winfx/2008/xaml/accordion"
        xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
        xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/core" >
    <Grid>
        <!-- ... -->
        <dxa:AccordionControl>
            <dxa:AccordionItem Header="Root Item" Glyph="{dxc:DXImage Image=Image_32x32.png}">
                <!-- Track bar editor is used as a subitem -->
                <dxe:TrackBarEdit/>
                <dxa:AccordionItem Header="SubItem" Glyph="{dxc:DXImage Image=Map_16x16.png}"/>
                <dxa:AccordionItem Header="SubItem" Glyph="{dxc:DXImage Image=Map_16x16.png}" >
                    <!-- See how ItemDisplayMode property affects accordion item appearance -->
                    <dxa:AccordionItem ItemDisplayMode="Default">
                        <!-- The header can display custom content -->
                        <dxa:AccordionItem.Header>
                            <Border BorderBrush="Blue" BorderThickness="1" Margin="2">
                                <StackPanel Margin="2">
                                    <Label>Default</Label>
                                    <dxe:SpinEdit/>
                                </StackPanel>
                            </Border>
                        </dxa:AccordionItem.Header>
                    </dxa:AccordionItem>

                    <dxa:AccordionItem ItemDisplayMode="Header">
                        <dxa:AccordionItem.Header>
                            <Border BorderBrush="Black" BorderThickness="1" Margin="2">
                                <StackPanel Margin="2">
                                    <Label>Header</Label>
                                    <dxe:SpinEdit/>
                                </StackPanel>
                            </Border>        
                        </dxa:AccordionItem.Header>
                        </dxa:AccordionItem>
                    </dxa:AccordionItem>
                </dxa:AccordionItem>
        </dxa:AccordionControl>
        <!-- ... -->
    </Grid>
</Window>
See Also