Skip to main content

DropDownDisplayMode Enum

Lists values that specify how a drop-down item displays a menu.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.1.dll

NuGet Package: DevExpress.Blazor


public enum DropDownDisplayMode


Name Description

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


The menu is shown as a drop-down list.


The menu is shown in a modal dialog.


The menu is shown in a modal bottom sheet.

Related API Members

The following properties accept/return DropDownDisplayMode values:


A toolbar item displays a drop-down list if you populate the DxToolbarItem.Items collection. The drop-down list can be displayed as a regular sub-menu, as a modal dialog, or as a modal bottom sheet. You can specify the type explicitly or let the component adapt to the device type. To specify the display mode, use the following properties:

These properties accept DropDownDisplayMode enumeration values.


  • When the DxToolbarBase.DropDownDisplayMode is set to Auto, toolbar menus are adapted to the device type.
  • When the DxToolbarItemBase.DropDownDisplayMode is set to Auto, a menu’s display mode is set up according to the DxToolbarBase.DropDownDisplayMode property’s value.
<div class="card p-2">
    <DxToolbar DropDownDisplayMode="DropDownDisplayMode.DropDown">
            <DxToolbarItem GroupName="align" IconCssClass="oi oi-align-left" />
            <DxToolbarItem GroupName="align" IconCssClass="oi oi-align-center" />
            <DxToolbarItem GroupName="align" IconCssClass="oi oi-align-right" />
            <DxToolbarItem Text="Format" BeginGroup="true">
                    <DxToolbarItem Text="Times New Roman" />
                    <DxToolbarItem Text="Tahoma" />
                    <DxToolbarItem Text="Verdana" />
            <DxToolbarItem Text="Size" DropDownDisplayMode="DropDownDisplayMode.ModalDialog">
                    <DxToolbarItem Text="8pt" />
                    <DxToolbarItem Text="10pt" />
                    <DxToolbarItem Text="12pt" />
            <DxToolbarItem Text="Style" DropDownDisplayMode="DropDownDisplayMode.ModalBottomSheet">
                    <DxToolbarItem IconCssClass="tb-icon tb-icon-bold" Text="Bold" />
                    <DxToolbarItem IconCssClass="tb-icon tb-icon-italic" Text="Italic" />
                    <DxToolbarItem IconCssClass="tb-icon tb-icon-underline" Text="Underline" />

Drop Down Display Mode

Run Demo: Toolbar - Drop-Down Items

See Also