Blazor Drawer
- 2 minutes to read
The DevExpress Drawer component for Blazor (DxDrawer) allows you to add a side panel to your application. Use this panel to host navigation controls or display additional information about the current view.
Features
Flexible Visibility Modes
You can implement a permanently visible, expandable, or responsive Drawer to adapt page layouts to different devices.
Minimized Drawer
Enable the MiniModeEnabled property to display a minimized panel when the full-size panel is closed. The mini panel allows you to save space yet enable single-click access to embedded commands.
Left and Right Drawer Position
The Position property allows you to display the Drawer panel at the left or right edge of the target content area.
Overlap and Shrink Open Modes
Use the Mode property to define how the Drawer interacts with the target content area in the opened state: overlaps or shrinks the content. In the Overlap mode, the Drawer overlaps and greys out target content. You can use the ApplyBackgroundShading property to disable background shading.
.NET 8 and .NET 9 Static Render Mode Support
In static render mode, the DxDrawer component can be displayed as a permanently visible element or you can add query params or specify CSS rules to dynamically change drawer visibility.