DropDownDisplayMode Enum

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

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v20.2.dll

Declaration

public enum DropDownDisplayMode

Members

Name Description
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.

Related API Members

The following properties accept/return DropDownDisplayMode values:

Remarks

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.

NOTE
  • 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.
<DxToolbar DropDownDisplayMode="DropDownDisplayMode.DropDown">
    <Items>
        <DxToolbarItem GroupName="align" IconCssClass="tb-icon tb-icon-align-left" />
        <DxToolbarItem GroupName="align" IconCssClass="tb-icon tb-icon-align-center" />
        <DxToolbarItem GroupName="align" IconCssClass="tb-icon tb-icon-align-right" />
        <DxToolbarItem Text="Format" BeginGroup="true">
            <Items>
                <DxToolbarItem Text="Times New Roman" />
                <DxToolbarItem Text="Tahoma" />
                <DxToolbarItem Text="Verdana" />
            </Items>
        </DxToolbarItem>
        <DxToolbarItem Text="Size" DropDownDisplayMode="DropDownDisplayMode.ModalDialog">
            <Items>
                <DxToolbarItem Text="8pt" />
                <DxToolbarItem Text="10pt" />
                <DxToolbarItem Text="12pt" />
            </Items>
        </DxToolbarItem>
        <DxToolbarItem Text="Style" DropDownDisplayMode="DropDownDisplayMode.ModalBottomSheet">
            <Items>
                <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" />
            </Items>
        </DxToolbarItem>
    </Items>
</DxToolbar>

Drop Down Display Mode

Run Demo: Toolbar - Drop-Down Items

See Also