Class Center


public class Center extends StyledElement<Center>
A container that centers its content both horizontally and vertically.

Center uses flexbox to center all child elements within its bounds. It's useful for centering content in the middle of the viewport, within cards, or any container where content should be perfectly centered.

Features:

  • Centers content on both axes by default
  • Optional horizontal-only or vertical-only centering
  • Configurable gap between centered items
  • Works with single or multiple children

Usage:


 // Center content in full viewport
 Center fullPage = new Center();
 fullPage.setHeight("100vh");
 fullPage.addElement(loginForm);

 // Center content with gap between items
 Center centered = new Center(16);
 centered.addElement(icon);
 centered.addElement(message);

 // Wrap and center existing element
 Center wrapped = new Center(existingElement);

 // Horizontal centering only
 Center horizontal = Center.horizontal();
 horizontal.addElement(content);

 // Vertical centering only
 Center vertical = Center.vertical();
 vertical.addElement(content);
 
Since:
2025
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:
  • Constructor Details

    • Center

      public Center()
      Constructs a center container that centers on both axes.
    • Center

      public Center(int gap)
      Constructs a center container with a gap between children.
      Parameters:
      gap - the gap in pixels between centered children
    • Center

      public Center(String gap)
      Constructs a center container with a gap between children.
      Parameters:
      gap - the gap value (e.g., "1rem", "16px")
    • Center

      public Center(Element<?> content)
      Constructs a center container containing the specified element.
      Parameters:
      content - the element to center
  • Method Details

    • horizontal

      public static Center horizontal()
      Creates a container that centers content horizontally only.

      Vertical alignment is set to stretch (default flex behavior).

      Returns:
      a new horizontal-only Center
    • vertical

      public static Center vertical()
      Creates a container that centers content vertically only.

      Horizontal alignment is set to stretch (default flex behavior).

      Returns:
      a new vertical-only Center
    • setGap

      public Center setGap(int gap)
      Sets the gap between centered children.
      Overrides:
      setGap in class StyledElement<Center>
      Parameters:
      gap - the gap in pixels
      Returns:
      this Center for method chaining
    • setGap

      public Center setGap(String gap)
      Sets the gap between centered children.
      Overrides:
      setGap in class StyledElement<Center>
      Parameters:
      gap - the gap value (e.g., "1rem", "16px")
      Returns:
      this Center for method chaining
    • fillViewport

      public Center fillViewport()
      Sets the container to fill the full viewport height.

      This is commonly used for full-page centering, such as login pages or splash screens.

      Returns:
      this Center for method chaining
    • fillParent

      public Center fillParent()
      Sets the container to fill its parent element completely.
      Returns:
      this Center for method chaining
    • asColumn

      public Center asColumn()
      Arranges multiple centered children in a column.

      By default, flex items are arranged in a row. This method switches to column direction, useful when centering multiple stacked elements.

      Returns:
      this Center for method chaining
    • asRow

      public Center asRow()
      Arranges multiple centered children in a row (default behavior).
      Returns:
      this Center for method chaining