nativeLabel represents the label HTML element that creates a caption for a component.

  • XML element: nativeLabel

  • Java class: NativeLabel


The nativeLabel component can serve as an alternative for the label attribute that is present in the majority of UI components in Jmix.

To set a label on a component, pass that component’s id to the setFor attribute of the label. For example, to set the label on a checkbox component:

    <checkbox id ="checkbox"/>
    <nativeLabel text="Enable Notifications" setFor="checkbox"/>
label basic

Having the label associated with a component makes the label text correctly interpreted by assistive technologies, such as screen readers.

To add text that is not associated to a component, use the span or div components.

Dynamic Label

To dynamically set or update text in nativeLabel, first specify its id attribute:

<nativeLabel id="dynamicLabel" setFor="button"/>
<button id="button" text="Click"/>

Use this id to reference the label in the view controller and update the text with the setText() method:

private NativeLabel dynamicLabel;

public void onButtonClick(final ClickEvent<JmixButton> event) {
    dynamicLabel.setText("Button clicked " + event.getClickCount() + " times.");
label dynamic

Theme Variants

Use the themeNames attribute to customize component’s color, size, and shape. Start by transforming the component into a badge using themeNames = "badge". Then, apply supplementary themes to enhance different visual aspects.


Choose among four color variants to convey the component’s visual intent: default, success, error, and contrast.

label badge color
XML code
<nativeLabel text="default" themeNames="badge"/>
<nativeLabel text="success" themeNames="badge, success"/>
<nativeLabel text="error" themeNames="badge, error"/>
<nativeLabel text="contrast" themeNames="badge, contrast"/>

Combine the color variants with the primary theme to add extra emphasis:

label badge color primary
XML code
<nativeLabel text="default" themeNames="badge, primary"/>
<nativeLabel text="success" themeNames="badge, success, primary"/>
<nativeLabel text="error" themeNames="badge, error, primary"/>
<nativeLabel text="contrast" themeNames="badge, contrast, primary"/>


Applying the pill theme creates a badge with rounded corners. Use it independently or combine with color themes:

label badge pill
XML code
<nativeLabel text="default" themeNames="badge, pill"/>
<nativeLabel text="success" themeNames="badge, success, pill"/>
<nativeLabel text="error" themeNames="badge, error, pill"/>
<nativeLabel text="contrast" themeNames="badge, contrast, pill"/>


Two size options are available: the default normal size and small.

label badge size
XML code
<nativeLabel text="normal" themeNames="badge, normal"/>
<nativeLabel text="small" themeNames="badge, small"/>



Specifies which element is to be associated with the label by providing its id.



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



  • PRE







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

See Also

See MDN Docs for more information.