div

div is a container that wraps related components together. If there are no attributes or nested components it represents nothing — users will see an empty space.

  • XML element: div

  • Java class: Div

Basics

The following example shows div that applies a standard theme to its nested component:

<div themeNames="badge">
    <p text="This paragraph is styled as a badge."/>
</div>
div basic

Variants

To use different styles, combine badge and another themeNames value. The following example shows success theme applied to the nested paragraph:

<div themeNames="badge, success">
    <p text="This paragraph has green text and a light green background."/>
</div>
div success

Attributes

id - alignSelf - classNames - colspan - css - enabled - height - maxHeight - maxWidth - minHeight - minWidth - text - themeNames - title - visible - whiteSpace - width

themeNames

Adds a theme to the component. Possible values are:

  • badge

  • normal

  • success

  • error

  • contrast

  • primary

  • small

  • pill

For theme to take effect, use a combination of badge and another value as shown above.

whiteSpace

MDN

Defines the component’s white-space style value. Possible values are:

  • NORMAL

  • NOWRAP

  • PRE

  • PRE_WRAP

  • PRE_LINE

  • BREAK_SPACES

  • INHERIT

  • INITIAL

Handlers

AttachEvent - ClickEvent - DetachEvent

Чтобы сгенерировать заглушку обработчика в Jmix Studio, используйте вкладку Handlers панели инспектора Jmix UI, или команду Generate Handler, доступную на верхней панели контроллера экрана и через меню Code → Generate (Alt+Insert / Cmd+N).

ClickEvent

com.vaadin.flow.component.ClickEvent is sent when the user clicks on the component.