nativeLabel

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

  • XML element: nativeLabel

  • Java class: NativeLabel

Basics

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:

<div>
    <checkbox id ="checkbox"/>
    <nativeLabel text="Enable Notifications" setFor="checkbox"/>
</div>
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:

@ViewComponent
private NativeLabel dynamicLabel;

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

Attributes

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

setFor

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

themeNames

Adds a theme to the component. Possible values are:

  • normal

  • success

  • error

  • contrast

  • primary

  • small

  • pill

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 - DetachEvent

To generate a handler stub in Jmix Studio, use the Handlers tab of the Jmix UI inspector panel or the Generate Handler action available in the top panel of the view class and through the Code → Generate menu (Alt+Insert / Cmd+N).

See Also

See MDN Docs for more information.