Package org.patternfly.component.page
package org.patternfly.component.page
Provides the PatternFly page layout component and its subcomponents.
The page component provides the overall structure for an application, including a masthead with branding and tools, a sidebar for navigation, and a main content area with sections. It includes support for the masthead, sidebar, page sections, breadcrumbs, navigation, tabs, and groups.
Key Classes
Display- Enumeration of page section display modes (inline, stack)Masthead- Application header with branding, navigation toggle, and toolsMastheadBrand- Brand area within the mastheadMastheadContent- Content area for header tools in the mastheadMastheadLogo- Logo link within the masthead brandMastheadMain- Main area of the masthead containing toggle and brandMastheadToggle- Navigation sidebar toggle button in the mastheadPage- Top-level page layout containerPageBreadcrumb- Breadcrumb section within a pagePageGroup- Group of page sectionsPageMain- Main content area of the pagePageNavigation- Navigation section within a pagePageSection- Content section within the page main areaPageSidebar- Sidebar container for vertical navigationPageSidebarBody- Body content within the page sidebarPageTabs- Tabs section within a pagePageWizard- Wizard section within a page
Usage
import static org.patternfly.component.page.Masthead.masthead;
import static org.patternfly.component.page.MastheadBrand.mastheadBrand;
import static org.patternfly.component.page.MastheadContent.mastheadContent;
import static org.patternfly.component.page.MastheadLogo.mastheadLogo;
import static org.patternfly.component.page.MastheadMain.mastheadMain;
import static org.patternfly.component.page.MastheadToggle.mastheadToggle;
import static org.patternfly.component.page.Page.page;
import static org.patternfly.component.page.PageMain.pageMain;
import static org.patternfly.component.page.PageSection.pageSection;
import static org.patternfly.component.page.PageSidebar.pageSidebar;
import static org.patternfly.component.page.PageSidebarBody.pageSidebarBody;
Page page = page()
.addMasthead(masthead()
.addMain(mastheadMain()
.addToggle(mastheadToggle())
.addBrand(mastheadBrand()
.addLogo(mastheadLogo("#")
.add("Logo"))))
.addContent(mastheadContent().text("Header tools")))
.addSidebar(pageSidebar()
.addBody(pageSidebarBody()
.add("Navigation")))
.addMain(pageMain("main-id")
.addSection(pageSection()
.text("Section 1"))
.addSection(pageSection().secondary()
.text("Section 2")));
- See Also:
-
ClassDescriptionDefines the display layout for
Mastheadcontent: inline or stacked.A masthead contains global properties such as logotype, navigation and settings in an organized fashion, and it is accessible from all parts of the application.A brand section within a masthead within aMastheadcomponent.Container for the content of aMastheadcomponent.A logo within a masthead within aMastheadcomponent.Container for the main area of aMastheadcomponent.Container for the toggle of aMastheadcomponent.The page component is used to define the basic layout of a page with either vertical or horizontal navigation.Container to group multiplePageSectionLikecontainers.Container for the main page area.Groups common methods/modifiers for page sections likePageBreadcrumbandPageSection.Common interface for page sections likePageBreadcrumbandPageSection.Container for the page sidebar.Container within thePageSidebarto hold content.