Package org.patternfly.component.drawer
package org.patternfly.component.drawer
Provides the PatternFly drawer component and its subcomponents for displaying a collapsible panel alongside content.
A drawer with the panel positioned at the start:
A drawer is a sliding panel that enters from the start, end, or bottom of the viewport. It can be used for task-based information, such as detail panels, help panels, or notification centers. The drawer supports overlay and inline modes, resizable panels, and configurable positions.
Usage
A basic drawer with a toggle button:import static org.patternfly.component.button.Button.button;
import static org.patternfly.component.drawer.Drawer.drawer;
import static org.patternfly.component.drawer.DrawerBody.drawerBody;
import static org.patternfly.component.drawer.DrawerCloseButton.drawerCloseButton;
import static org.patternfly.component.drawer.DrawerContent.drawerContent;
import static org.patternfly.component.drawer.DrawerPanel.drawerPanel;
import static org.patternfly.component.drawer.DrawerPanelHead.drawerPanelHead;
Drawer drawer = drawer();
button("Toggle drawer").primary()
.onClick((event, btn) -> drawer.toggle());
drawer
.addContent(drawerContent()
.addBody(drawerBody().text("Main content")))
.addPanel(drawerPanel()
.addHead(drawerPanelHead()
.add(span().text("Panel content"))
.addCloseButton(drawerCloseButton())));
import static org.patternfly.component.drawer.Drawer.drawer;
import static org.patternfly.component.drawer.DrawerBody.drawerBody;
import static org.patternfly.component.drawer.DrawerContent.drawerContent;
import static org.patternfly.component.drawer.DrawerPanel.drawerPanel;
import static org.patternfly.component.drawer.Position.start;
drawer().position(start)
.addContent(drawerContent()
.addBody(drawerBody().text("Main content")))
.addPanel(drawerPanel());
- See Also:
-
ClassDescriptionA drawer is a sliding panel that enters from the right edge of the viewport.Subcomponent for elements in a
DrawerContent.The close button within aDrawerPanelHead.Defines the background color variants available for aDrawerpanel.The main content in aDrawercomponent.The sliding panel in aDrawercomponent.Subcomponent for the header inside aDrawerPanel.Defines the position of theDrawerpanel relative to the main content.