Package org.patternfly.layout.gallery
package org.patternfly.layout.gallery
Provides the PatternFly gallery layout for arranging content in a responsive grid with uniform rows and columns that wrap
automatically.
A gallery with responsive minimum widths:
The gallery layout is useful for displaying a collection of similarly structured items, such as cards or tiles, in a responsive grid. It supports gutters for spacing between items and allows adjusting minimum and maximum widths at different breakpoints.
Usage
A basic gallery with gutters:import static org.patternfly.layout.gallery.Gallery.gallery;
import static org.patternfly.layout.gallery.GalleryItem.galleryItem;
gallery().gutter()
.addItem(galleryItem().text("Gallery item"))
.addItem(galleryItem().text("Gallery item"))
.addItem(galleryItem().text("Gallery item"))
.addItem(galleryItem().text("Gallery item"));
import static org.patternfly.core.Tuple.tuple;
import static org.patternfly.layout.gallery.Gallery.gallery;
import static org.patternfly.layout.gallery.GalleryItem.galleryItem;
import static org.patternfly.style.Breakpoint.lg;
import static org.patternfly.style.Breakpoint.md;
import static org.patternfly.style.Breakpoint.xl;
gallery().gutter()
.minWidths(tuple(md, "100px"), tuple(lg, "150px"), tuple(xl, "200px"))
.addItem(galleryItem().text("Gallery item"))
.addItem(galleryItem().text("Gallery item"))
.addItem(galleryItem().text("Gallery item"));
- See Also:
-
ClassesClassDescriptionThe gallery layout is used to arrange content in a responsive grid.