Package com.vaadin.flow.component.orderedlayout

Class FlexLayout

java.lang.Object

com.vaadin.flow.component.Component

com.vaadin.flow.component.orderedlayout.FlexLayout

All Implemented Interfaces:

AttachNotifier, ClickNotifier<FlexLayout>, DetachNotifier, HasComponents, HasElement, HasEnabled, HasOrderedComponents, HasSize, HasStyle, FlexComponent, Serializable

@Tag("div")
public class FlexLayout
extends Component
implements FlexComponent, 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.

Nested classes/interfaces inherited from interface com.vaadin.flow.component.orderedlayout.FlexComponent

FlexComponent.Alignment, FlexComponent.JustifyContentMode

Constructor Summary

Constructors

Constructor	Description
FlexLayout()	Default constructor.
FlexLayout(Component... children)	Convenience constructor to create a layout with the children already inside it.

Method Summary

Modifier and Type	Method	Description
FlexLayout.ContentAlignment	getAlignContent()	Gets the current align content property of the layout.
String	getFlexBasis(HasElement elementContainer)	Gets the flex basis property of a given element container.
FlexLayout.FlexDirection	getFlexDirection()	Gets the flex direction property of the layout.
FlexLayout.FlexDirection	getFlexDirection(HasElement elementContainer)	Deprecated. since 23.3 - use getFlexDirection() to get the flex direction property of the layout directly
double	getFlexShrink(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(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, 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, 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, HasElement elementContainer)	Sets the order property of the component inside the layout.

Methods inherited from class com.vaadin.flow.component.Component

addListener, findAncestor, fireEvent, from, get, getChildren, getElement, getEventBus, getId, getListeners, getLocale, getParent, getTranslation, getTranslation, getTranslation, getTranslation, getTranslation, getTranslation, getUI, hasListener, isAttached, isTemplateMapped, isVisible, onAttach, onDetach, onEnabledStateChanged, scrollIntoView, set, setElement, setId, setVisible

Methods inherited from class java.lang.Object

clone, equals, finalize, getClass, hashCode, notify, notifyAll, toString, wait, wait, wait

Methods inherited from interface com.vaadin.flow.component.AttachNotifier

addAttachListener

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

addClickListener, addClickShortcut, addDoubleClickListener, addSingleClickListener

Methods inherited from interface com.vaadin.flow.component.DetachNotifier

addDetachListener

Methods inherited from interface com.vaadin.flow.component.orderedlayout.FlexComponent

expand, getAlignItems, getAlignSelf, getFlexGrow, getJustifyContentMode, replace, setAlignItems, setAlignSelf, setFlexGrow, setJustifyContentMode

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

add, add, add, addComponentAsFirst, addComponentAtIndex, remove, 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(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

setFlexWrap

public void setFlexWrap(FlexLayout.FlexWrap flexWrap)

Gets the FlexLayout.FlexWrap used by this layout.

The default flex wrap is FlexLayout.FlexWrap.NOWRAP.

Parameters:

flexWrap - the flex wrap of the layout, never null

getFlexWrap

public FlexLayout.FlexWrap getFlexWrap()

Gets the current flex wrap of the layout.

The default flex wrap is FlexLayout.FlexWrap.NOWRAP.

Returns:

the flex wrap used by the layout, never null

setAlignContent

public void setAlignContent(FlexLayout.ContentAlignment alignment)

Similar to FlexComponent.setAlignItems(Alignment), but instead of aligning components, it aligns flex lines.

It effectively sets the "alignContent" style value.

The default alignment is FlexLayout.ContentAlignment.STRETCH.

Parameters:

alignment - the alignment to apply to the components. Setting null will reset the alignment to its default

getAlignContent

public FlexLayout.ContentAlignment getAlignContent()

Gets the current align content property of the layout.

Returns:

the align content property, or FlexLayout.ContentAlignment.STRETCH if none was set

setFlexBasis

public void setFlexBasis(String width,
                         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(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()

Gets the flex direction property of the layout.

Returns:

the flex direction property, or FlexLayout.FlexDirection.ROW if none was set

getFlexDirection

public FlexLayout.FlexDirection getFlexDirection(HasElement elementContainer)

Deprecated.

since 23.3 - use getFlexDirection() to get the flex direction property of the layout directly

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,
                          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(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,
                     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(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