Back to Devexpress

DxMenuItem.AdaptivePriority Property

blazor-devexpress-dot-blazor-dot-dxmenuitem-1d002890.md

latest2.3 KB
Original Source

DxMenuItem.AdaptivePriority Property

Specifies the order in which the Menu component hides text of root items when the browser window is resized.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

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

Property Value

TypeDefaultDescription
Int320

The item priority.

|

Remarks

The Menu component supports Sequentially adaptive mode. In this mode, the component hides text of root items and displays icons instead when the width of the browser window changes. The default settings hide item text sequentially from the last item. To change this behavior, use the AdaptivePriority property that specifies the order in which item text is hidden (higher values are hidden first).

The following code snippet forces the menu to hide text of its items in the following order: SupportAboutDocumentation.

razor
<div class="card w-auto">
    <DxMenu Title="DevExpress"
            CollapseItemToIconMode="MenuCollapseItemToIconMode.Sequentially"
            DisplayMode="MenuDisplayMode.Desktop">
        <Items>
            <DxMenuItem Text="Support" 
                        IconCssClass="menu-icon-support menu-icon" 
                        AdaptivePriority="2" />
            <DxMenuItem Text="Documentation" 
                        IconCssClass="menu-icon-contacts menu-icon"
                        AdaptivePriority="0" />
            <DxMenuItem Text="About" 
                        IconCssClass="menu-icon-about menu-icon"
                        AdaptivePriority="1" />
        </Items>
    </DxMenu>
</div>

Run Demo: Menu - Adaptivity

See Also

DxMenuItem Class

DxMenuItem Members

DevExpress.Blazor Namespace