icon

LIVE DEMO

icon displays an image sourced from an icon set.

  • XML element: icon

  • Java class: Icon

Basics

Use icon to add a standalone icon anywhere on the view.

<icon icon="CAR"/>
<icon icon="AIRPLANE"/>
<icon icon="TRAIN"/>
icon basic

Icon Sets

There are two built-in icon sets containing frequently used icons: Vaadin and Lumo. To differentiate between sets, add its prefix before the icon name. If no prefix is present, the Vaadin set is used.

<icon icon="USER"/>
<icon icon="vaadin:user"/>
<icon icon="lumo:user"/>
icon sets

Components with Icons

Icon can be a part of a component. See an example of using an icon with the button component.

Attributes

id - alignSelf - classNames - clickShortcut - color - colspan - css - icon - size - visible

color

Sets the color for icon.

icon

Specifies the icon to be displayed.

size

Specifies the size of the icon.

Handlers

AttachEvent - ClickEvent - DetachEvent

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

ClickEvent

The com.vaadin.flow.component.ClickEvent is fired when the component is clicked. This handler must specify one of the following three subjects to detect the number of clicks related to the event.

  • click – fires the event whenever the component is clicked.

  • singleClick – fires the event after a timeout to ensure it is not a double click.

  • doubleClick – fires the event when the component is double-clicked.

Elements

tooltip

See Also

See Vaadin Docs for more information.