Class FlexLayout

  • All Implemented Interfaces:
    com.vaadin.flow.component.AttachNotifier, com.vaadin.flow.component.ClickNotifier<FlexLayout>, com.vaadin.flow.component.DetachNotifier, com.vaadin.flow.component.HasComponents, com.vaadin.flow.component.HasElement, com.vaadin.flow.component.HasEnabled, com.vaadin.flow.component.HasOrderedComponents, com.vaadin.flow.component.HasSize, com.vaadin.flow.component.HasStyle, FlexComponent, Serializable

    @Tag("div")
    public class FlexLayout
    extends com.vaadin.flow.component.Component
    implements FlexComponent, com.vaadin.flow.component.ClickNotifier<FlexLayout>
    A layout component that implements Flexbox. It uses the default flex-direction and doesn't have any predetermined width or height.

    This component can be used as a base class for more advanced layouts.

    See Also:
    Using CSS Flexible boxes on MDN, Serialized Form
    • Nested Class Summary

      Nested Classes 
      Modifier and Type Class Description
      static class  FlexLayout.ContentAlignment
      Enum with the possible values for the component alignment inside the layout.
      static class  FlexLayout.FlexDirection
      Possible values for the flex-direction CSS property, which determines how the elements are placed inside the layout.
      static class  FlexLayout.FlexWrap
      Possible values for the flex-wrap CSS property, which determines how the elements inside the layout should behave when they don't fit inside the layout.
    • Constructor Summary

      Constructors 
      Constructor Description
      FlexLayout()
      Default constructor.
      FlexLayout​(com.vaadin.flow.component.Component... children)
      Convenience constructor to create a layout with the children already inside it.
    • Method Summary

      All Methods Instance Methods Concrete Methods 
      Modifier and Type Method Description
      FlexLayout.ContentAlignment getAlignContent()
      Gets the current align content property of the layout.
      String getFlexBasis​(com.vaadin.flow.component.HasElement elementContainer)
      Gets the flex basis property of a given element container.
      FlexLayout.FlexDirection getFlexDirection​(com.vaadin.flow.component.HasElement elementContainer)
      Gets the flex direction property of a given element container.
      double getFlexShrink​(com.vaadin.flow.component.HasElement elementContainer)
      Gets the flex shrink property of a given element container.
      FlexLayout.FlexWrap getFlexWrap()
      Gets the current flex wrap of the layout.
      int getOrder​(com.vaadin.flow.component.HasElement elementContainer)
      Gets the order property of a given element container.
      void setAlignContent​(FlexLayout.ContentAlignment alignment)
      Similar to FlexComponent.setAlignItems(Alignment), but instead of aligning components, it aligns flex lines.
      void setFlexBasis​(String width, com.vaadin.flow.component.HasElement... elementContainers)
      Sets the flex basis property of the components inside the layout.
      void setFlexDirection​(FlexLayout.FlexDirection flexDirection)
      Sets the flex direction property of the layout.
      void setFlexShrink​(double flexShrink, com.vaadin.flow.component.HasElement... elementContainers)
      Sets the flex shrink property of the components inside the layout.
      void setFlexWrap​(FlexLayout.FlexWrap flexWrap)
      Gets the FlexLayout.FlexWrap used by this layout.
      void setOrder​(int order, com.vaadin.flow.component.HasElement elementContainer)
      Sets the order property of the component inside the layout.
      • Methods inherited from class com.vaadin.flow.component.Component

        addListener, fireEvent, from, get, getChildren, getElement, getEventBus, getId, getLocale, getParent, getTranslation, getTranslation, getTranslation, getUI, hasListener, isAttached, isTemplateMapped, isVisible, onAttach, onDetach, onEnabledStateChanged, scrollIntoView, set, setElement, setId, setVisible
      • Methods inherited from interface com.vaadin.flow.component.AttachNotifier

        addAttachListener
      • Methods inherited from interface com.vaadin.flow.component.ClickNotifier

        addClickListener, addClickShortcut
      • Methods inherited from interface com.vaadin.flow.component.DetachNotifier

        addDetachListener
      • Methods inherited from interface com.vaadin.flow.component.HasComponents

        add, add, addComponentAsFirst, addComponentAtIndex, remove, removeAll
      • Methods inherited from interface com.vaadin.flow.component.HasElement

        getElement
      • Methods inherited from interface com.vaadin.flow.component.HasEnabled

        isEnabled, setEnabled
      • Methods inherited from interface com.vaadin.flow.component.HasOrderedComponents

        getChildren, getComponentAt, getComponentCount, indexOf
      • Methods inherited from interface com.vaadin.flow.component.HasSize

        getHeight, getHeightUnit, getMaxHeight, getMaxWidth, getMinHeight, getMinWidth, getWidth, getWidthUnit, setHeight, setHeight, setHeightFull, setMaxHeight, setMaxHeight, setMaxWidth, setMaxWidth, setMinHeight, setMinHeight, setMinWidth, setMinWidth, setSizeFull, setSizeUndefined, setWidth, setWidth, setWidthFull
      • Methods inherited from interface com.vaadin.flow.component.HasStyle

        addClassName, addClassNames, getClassName, getClassNames, getStyle, hasClassName, removeClassName, removeClassNames, setClassName, setClassName
    • Constructor Detail

      • FlexLayout

        public FlexLayout()
        Default constructor. Creates an empty layout.
      • FlexLayout

        public FlexLayout​(com.vaadin.flow.component.Component... children)
        Convenience constructor to create a layout with the children already inside it.
        Parameters:
        children - the items to add to this layout
        See Also:
        HasComponents.add(Component...)
    • Method Detail

      • setFlexBasis

        public void setFlexBasis​(String width,
                                 com.vaadin.flow.component.HasElement... elementContainers)
        Sets the flex basis property of the components inside the layout. The flex basis property specifies the initial main size of a component.
        Parameters:
        width - the width for the components. Setting null will remove the flex basis property
        elementContainers - the containers (components) to apply the flex basis property
      • getFlexBasis

        public String getFlexBasis​(com.vaadin.flow.component.HasElement elementContainer)
        Gets the flex basis property of a given element container.
        Parameters:
        elementContainer - the element container to read the flex basis property from
        Returns:
        the flex grow property
      • setFlexDirection

        public void setFlexDirection​(FlexLayout.FlexDirection flexDirection)
        Sets the flex direction property of the layout. The flex direction property specifies how components are placed in the layout defining the main axis and the direction (normal or reversed). The default direction is FlexLayout.FlexDirection.ROW.
        Parameters:
        flexDirection - the direction for the components. Setting null will remove the flex direction property
      • getFlexDirection

        public FlexLayout.FlexDirection getFlexDirection​(com.vaadin.flow.component.HasElement elementContainer)
        Gets the flex direction property of a given element container.
        Parameters:
        elementContainer - the element container to read the flex direction property from
        Returns:
        the flex direction property, or FlexLayout.FlexDirection.ROW if none was set
      • setFlexShrink

        public void setFlexShrink​(double flexShrink,
                                  com.vaadin.flow.component.HasElement... elementContainers)
        Sets the flex shrink property of the components inside the layout. The flex shrink property specifies how the item will shrink relative to the rest of the components inside the same layout. Negative values are not allowed. The default value is 1.
        Parameters:
        flexShrink - how much the component will shrink relative to the rest of the components
        elementContainers - the containers (components) to apply the flex shrink property
      • getFlexShrink

        public double getFlexShrink​(com.vaadin.flow.component.HasElement elementContainer)
        Gets the flex shrink property of a given element container.
        Parameters:
        elementContainer - the element container to read the flex shrink property from
        Returns:
        the flex shrink property, or 1 if none was set
      • setOrder

        public void setOrder​(int order,
                             com.vaadin.flow.component.HasElement elementContainer)
        Sets the order property of the component inside the layout. The order property specifies the order of a component relative to the rest of the components inside the same layout. The default value is 0, and setting 0 can be used to remove an existing order for a component.
        Parameters:
        order - the order for the component
        elementContainer - the container (component) to apply the order property
      • getOrder

        public int getOrder​(com.vaadin.flow.component.HasElement elementContainer)
        Gets the order property of a given element container.
        Parameters:
        elementContainer - the element container to read the order property from
        Returns:
        the order property, or 0 if none was set