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.

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"));

A gallery with responsive minimum widths:

 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:
  • Classes
    Class
    Description
    The gallery layout is used to arrange content in a responsive grid.
    An item within a Gallery layout container.