Back to Devexpress

DxSplitButton.DropDownDisplayMode Property

blazor-devexpress-dot-blazor-dot-dxsplitbutton-9bb71802.md

latest2.4 KB
Original Source

DxSplitButton.DropDownDisplayMode Property

Specifies how the Split Button component displays its drop-down elements.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[DefaultValue(DropDownDisplayMode.Auto)]
[Parameter]
public DropDownDisplayMode DropDownDisplayMode { get; set; }

Property Value

TypeDefaultDescription
DropDownDisplayModeAuto

An enumeration value.

|

Available values:

NameDescription
Auto

Mobile and tablet devices show the menu in a modal bottom sheet.
Other device types show the menu as a drop-down list. ‘

| | DropDown |

The menu is shown as a drop-down list.

| | ModalDialog |

The menu is shown in a modal dialog.

| | ModalBottomSheet |

The menu is shown in a modal bottom sheet.

|

Remarks

Use the DropDownDisplayMode property to specify display mode for the Split Button component’s drop-down elements. When the property is set to Auto, drop-down elements adapt to the device type.

The following code snippet changes the display mode of drop-down elements:

razor
<DxSplitButton RenderStyle="ButtonRenderStyle.Secondary"
               Text="Clipboard"
               IconCssClass="tb-icon tb-icon-paste"
               CssClass="me-1"
               DropDownDisplayMode="DropDownDisplayMode.ModalBottomSheet">
    <Items>
        <DxDropDownButtonItem Text="Cut" IconCssClass="menu-icon-cut menu-icon" />
        <DxDropDownButtonItem Text="Copy" IconCssClass="menu-icon-copy menu-icon" />
        <DxDropDownButtonItem Text="Paste" IconCssClass="tb-icon tb-icon-paste" />
        <DxDropDownButtonItem Text="Paste Special" BeginGroup="true">
            <Items>
                <DxDropDownButtonItem Text="Paste Text Only" />
                <DxDropDownButtonItem Text="Paste Picture" Enabled="false" />
                <DxDropDownButtonItem Text="Paste as Hyperlink" />
            </Items>
        </DxDropDownButtonItem>
    </Items>
</DxSplitButton>

See Also

DxSplitButton Class

DxSplitButton Members

DevExpress.Blazor Namespace