Package com.vaadin.flow.component.orderedlayout

Class VerticalLayout

java.lang.Object

com.vaadin.flow.component.Component

com.vaadin.flow.component.orderedlayout.VerticalLayout

All Implemented Interfaces:

AttachNotifier, ClickNotifier<VerticalLayout>, DetachNotifier, HasComponents, HasElement, HasEnabled, HasOrderedComponents, HasSize, HasStyle, HasTheme, FlexComponent, ThemableLayout, HasThemeVariant<VerticalLayoutVariant>, Serializable

@Tag("vaadin-vertical-layout")
@NpmPackage(value="@vaadin/vertical-layout",
            version="25.0.2")
@JsModule("@vaadin/vertical-layout/src/vaadin-vertical-layout.js")
public class VerticalLayout
extends Component
implements ThemableLayout, FlexComponent, ClickNotifier<VerticalLayout>, HasThemeVariant<VerticalLayoutVariant>

Vertical Layout places components top-to-bottom in a column. By default, it has 100% width and undefined height, meaning its width is constrained by its parent component and its height is determined by the components it contains.

See Also:

• Serialized Form

Nested Class Summary

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

FlexComponent.Alignment, FlexComponent.JustifyContentMode

Constructor Summary

Constructors

Constructor	Description
VerticalLayout()	Constructs an empty layout with spacing and padding on by default.
VerticalLayout(Component... children)	Convenience constructor to create a layout with the children already inside it.
VerticalLayout(FlexComponent.Alignment alignment, Component... children)	Convenience constructor to create a layout with the children and specified horizontal alignment.
VerticalLayout(FlexComponent.JustifyContentMode justifyContentMode, Component... children)	Convenience constructor to create a layout with the children and specified justifyContentMode.

Method Summary

Modifier and Type	Method	Description
void	addAndExpand(Component... components)	Adds the given components to this layout and sets them as expanded.
FlexComponent.Alignment	getAlignItems()	This is the same as getDefaultHorizontalComponentAlignment().
FlexComponent.Alignment	getAlignSelf(HasElement component)	This is the same as getHorizontalComponentAlignment(Component).
FlexComponent.Alignment	getDefaultHorizontalComponentAlignment()	Gets the default horizontal alignment used by all components without individual alignments inside the layout.
FlexComponent.Alignment	getHorizontalComponentAlignment(Component component)	Gets the individual horizontal alignment of a given component.
void	setAlignItems(FlexComponent.Alignment alignment)	This is the same as setDefaultHorizontalComponentAlignment(Alignment).
void	setAlignSelf(FlexComponent.Alignment alignment, HasElement... components)	This is the same as setHorizontalComponentAlignment(Alignment, Component...).
void	setDefaultHorizontalComponentAlignment(FlexComponent.Alignment alignment)	Sets the default horizontal alignment to be used by all components without individual alignments inside the layout.
void	setHorizontalComponentAlignment(FlexComponent.Alignment alignment, Component... componentsToAlign)	Sets a horizontal alignment for individual components inside the layout.
void	setPadding(boolean padding)	Toggles padding theme setting for the element.
void	setSpacing(boolean spacing)	Toggles spacing theme setting for the element.

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, removeFromParent, scrollIntoView, 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, getFlexGrow, getFlexShrink, getJustifyContentMode, replace, setFlexGrow, setFlexShrink, 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

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

addThemeName, addThemeNames, getThemeName, getThemeNames, hasThemeName, removeThemeName, removeThemeNames, setThemeName, setThemeName

Methods inherited from interface com.vaadin.flow.component.shared.HasThemeVariant

addThemeVariants, removeThemeVariants, setThemeVariant, setThemeVariants, setThemeVariants

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

getBoxSizing, getSpacing, getThemeList, isMargin, isPadding, isSpacing, isWrap, setBoxSizing, setMargin, setSpacing, setSpacing, setWrap

Constructor Details

VerticalLayout

public VerticalLayout()

Constructs an empty layout with spacing and padding on by default.

VerticalLayout

public VerticalLayout(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...)

VerticalLayout

public VerticalLayout(FlexComponent.JustifyContentMode justifyContentMode,
 Component... children)

Convenience constructor to create a layout with the children and specified justifyContentMode.

Parameters:

justifyContentMode - the justifyContentMode

children - the items to add to this layout

See Also:

• HasComponents.add(Component...)
• FlexComponent.setJustifyContentMode(JustifyContentMode)

VerticalLayout

public VerticalLayout(FlexComponent.Alignment alignment,
 Component... children)

Convenience constructor to create a layout with the children and specified horizontal alignment.

Parameters:

alignment - the horizontal alignment

children - the items to add to this layout

See Also:

• HasComponents.add(Component...)
• setDefaultHorizontalComponentAlignment(Alignment)

Method Details

setSpacing

public void setSpacing(boolean spacing)

Toggles spacing theme setting for the element. If a theme supports this attribute, it will apply or remove spacing to the element.

This method adds medium spacing to the component theme, to set other options, use ThemableLayout.getThemeList(). List of options possible:

• spacing-xs
• spacing-s
• spacing
• spacing-l
• spacing-xl

Spacing is enabled by default for vertical layout.

Specified by:

setSpacing in interface ThemableLayout

Parameters:

spacing - adds spacing theme setting if true or removes it if false

setPadding

public void setPadding(boolean padding)

Toggles padding theme setting for the element. If a theme supports this attribute, it will apply or remove padding to the element.

Padding is enabled by default for vertical layout.

Specified by:

setPadding in interface ThemableLayout

Parameters:

padding - adds padding theme setting if true or removes it if false

setHorizontalComponentAlignment

public void setHorizontalComponentAlignment(FlexComponent.Alignment alignment,
 Component... componentsToAlign)

Sets a horizontal alignment for individual components inside the layout. This individual alignment for the component overrides any alignment set at the setDefaultHorizontalComponentAlignment(Alignment).

The default alignment for individual components is FlexComponent.Alignment.AUTO.

It's the same as the setAlignSelf(Alignment, HasElement...) method.

Parameters:

alignment - the individual alignment for the children components. Setting null will reset the alignment to its default

componentsToAlign - The components to which the individual alignment should be set

getHorizontalComponentAlignment

public FlexComponent.Alignment getHorizontalComponentAlignment(Component component)

Gets the individual horizontal alignment of a given component.

The default alignment for individual components is FlexComponent.Alignment.AUTO.

It's the same as the getAlignSelf(HasElement) method

Parameters:

component - The component which individual layout should be read

Returns:

the alignment of the component, never null

See Also:

• getAlignSelf(HasElement)

setDefaultHorizontalComponentAlignment

public void setDefaultHorizontalComponentAlignment(FlexComponent.Alignment alignment)

Sets the default horizontal alignment to be used by all components without individual alignments inside the layout. Individual components can be aligned by using the setHorizontalComponentAlignment(Alignment, Component...) method.

The default alignment is FlexComponent.Alignment.START.

It's the same as the setAlignItems(Alignment) method.

Parameters:

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

getDefaultHorizontalComponentAlignment

public FlexComponent.Alignment getDefaultHorizontalComponentAlignment()

Gets the default horizontal alignment used by all components without individual alignments inside the layout.

The default alignment is FlexComponent.Alignment.START.

It's the same as the getAlignItems() method.

Returns:

the general alignment used by the layout, never null

setAlignItems

public void setAlignItems(FlexComponent.Alignment alignment)

This is the same as setDefaultHorizontalComponentAlignment(Alignment).

Specified by:

setAlignItems in interface FlexComponent

Parameters:

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

See Also:

• setDefaultHorizontalComponentAlignment(Alignment)

getAlignItems

public FlexComponent.Alignment getAlignItems()

This is the same as getDefaultHorizontalComponentAlignment().

Specified by:

getAlignItems in interface FlexComponent

Returns:

the general alignment used by the layout, never null

setAlignSelf

public void setAlignSelf(FlexComponent.Alignment alignment,
 HasElement... components)

This is the same as setHorizontalComponentAlignment(Alignment, Component...).

Specified by:

setAlignSelf in interface FlexComponent

Parameters:

alignment - the individual alignment for the children components. Setting null will reset the alignment to its default

components - The components to which the individual alignment should be set

See Also:

• setHorizontalComponentAlignment(Alignment, Component...)

getAlignSelf

public FlexComponent.Alignment getAlignSelf(HasElement component)

This is the same as getHorizontalComponentAlignment(Component).

Specified by:

getAlignSelf in interface FlexComponent

Parameters:

component - The component which individual layout should be read

Returns:

the alignment of the component, never null

See Also:

• getHorizontalComponentAlignment(Component)

addAndExpand

public void addAndExpand(Component... components)

Adds the given components to this layout and sets them as expanded. The flex-grow of all added child components are set to 1 so that the expansion will be effective. The height of this layout is also set to 100%.

Parameters:

components - the components to set, not null