DxMenuItem.AdaptivePriority Property

Specifies the order in which items are hidden when the browser window is resized.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v20.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(0)]
[Parameter]
public int AdaptivePriority { get; set; }

Property Value

Type	Default	Description
Int32	0	The item priority.

Remarks

The Menu component supports adaptive mode. You can use the CollapseItemToIconMode property to specify whether the menu hides item text and displays icons instead when the width of the browser window changes.

You can also use the AdaptivePriority property to specify the order in which menu items are hidden.

The code below forces the menu to hide text of its items in the following order: Support -> Demos -> Documentation.

<div class="card w-auto">
    <DxMenu Title="DevExpress"
            CollapseItemToIconMode="MenuCollapseItemToIconMode.Sequentially"
            DisplayMode="MenuDisplayMode.Desktop">
        <Items>
            <DxMenuItem Text="Support" 
                        IconCssClass="oi oi-person" 
                        AdaptivePriority="2" />
            <DxMenuItem Text="Documentation" 
                        IconCssClass="oi oi-book" 
                        AdaptivePriority="0" />
            <DxMenuItem Text="Demos" 
                        IconCssClass="oi oi-monitor" 
                        AdaptivePriority="1" />
        </Items>
    </DxMenu>
</div>

Run Demo: Menu - Adaptivity