DxDrawer.ApplyBackgroundShading Property

Specifies whether to shade the target content area when the drawer panel appears (for the Overlap mode only).

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(true)]
[Parameter]
public bool ApplyBackgroundShading { get; set; }

Property Value

Type	Default	Description
Boolean	true	true to shade the background; otherwise, false.

Remarks

When the Mode property is set to Overlap, the drawer panel overlaps and greys out the target content area.

Disable the ApplyBackgroundShading option to not shade the target content.

<DxDrawer IsOpen="IsOpen" Mode="DrawerMode.Overlap" ApplyBackgroundShading="false" PanelWidth="20%">
    <BodyTemplate>
        <DxMenu Orientation="Orientation.Vertical">
            <Items>
                <DxMenuItem Text="Home" IconCssClass="menu-icon-home menu-icon" />
                <DxMenuItem Text="Components" IconCssClass="menu-icon-products menu-icon" />
                <DxMenuItem Text="Support" IconCssClass="menu-icon-support menu-icon" />
                <DxMenuItem Text="Contacts" IconCssClass="menu-icon-contacts menu-icon" />
                <DxMenuItem Text="About" IconCssClass="menu-icon-about menu-icon" />
            </Items>
        </DxMenu>
    </BodyTemplate>
    <TargetContent>
        @* Lorem ipsum dolor sit amet, consectetur adipiscing elit ... *@
    </TargetContent>
</DxDrawer>