Label

Label - 文本标签 是一个文本组件,用于展示静态文本或者实体属性值。

组件的 XML 名称:label

Simple Label

示例:

<label value="Simple label"/>

value 属性设置标签的文本值。

如果 value 属性设置的文本长度超出 width 值,文件会分为多行显示。因此,显示一个多行标签,可以为标签的 width 指定一个绝对值。如果文本过长但是 width 值未定,文本会被截断。

<label value="Label, which should be split into multiple lines"
       width="200px"/>

动态标签

可以在界面控制器中设置标签的参数。需要给标签组件设置一个 id,然后在界面控制器中获取引用:

<label id="dynamicLabel"/>
@Autowired
private Label<String> dynamicLabel;

@Subscribe
protected void onInit(InitEvent event) {
    dynamicLabel.setValue("Some value");
}

数据感知的标签

Label 组件还可以显示实体属性值。需要设置 dataContainerproperty 属性,示例:

<data>
    <instance id="customerDc"
              class="ui.ex1.entity.Customer"/>
</data>
<layout>
        <label align="MIDDLE_CENTER"
               dataContainer="customerDc"
               property="firstName"/>
</layout>

上面例子中,标签组件显示 customerDc 数据容器中实体 Customername 字段。

HTML 内容

htmlEnabled 属性控制如何解析 value 属性值:如果 htmlEnabled="true",则 value 值以 HTML 代码解析,否则按纯文本解析。

htmlSanitizerEnabled 属性可以启用或禁用 HTML 清理。如果 htmlEnabledhtmlSanitizerEnabled 属性都设置为 true,则标签的 value 会被清理。

@Autowired
private Label<String> htmlLabel;

private static final String UNSAFE_HTML = "<i>Jackdaws </i><u>love</u> " +
        "<font size=\"javascript:alert(1)\" " +
        "color=\"moccasin\">my</font> " +
        "<font size=\"7\">big</font> <sup>sphinx</sup> " +
        "<font face=\"Verdana\">of</font> <span style=\"background-color: " +
        "red;\">quartz</span><svg/onload=alert(\"XSS\")>";

@Subscribe
protected void onInit(InitEvent event) {
    htmlLabel.setHtmlEnabled(true);
    htmlLabel.setHtmlSanitizerEnabled(true);
    htmlLabel.setValue(UNSAFE_HTML);
}

预定义样式

如需为 Label 组件设置自定义样式,可以在 XML 配置或者在界面控制器中设置 stylename 属性:

<label value="Colored label"
       stylename="colored"/>
@Autowired
private Label<String> styledLabel;

@Subscribe
protected void onInit(InitEvent event) {
    styledLabel.setStyleName("bold");
}
  • bold - 粗体字。适用于重要的或者需要突出显示的 UI 文本。

  • colored - 彩色文本。

  • failure - 失败标签样式。标签外会有一个边框,文本旁边会有一个图标。适用于一些组件内部的上下文通知。

  • h1 - 标题样式,应用程序主标题。

  • h2 - 标题样式,应用程序章节标题。

  • h3 - 标题样式,应用程序子章节标题。

  • h4 - 标题样式,应用程序子章节标题。

  • light - 细体字。适用于附加/补充文本。

  • spinner - 等待中样式。添加到空 Label 组件则可以创建一个可用于表示任务进行中的旋转图标。

  • success - 成功标签样式。标签外会有一个边框,文本旁会有一个图标。适用于一些组件内部的上下文通知。

事件和处理器

如需使用 Jmix Studio 生成处理器的桩代码,需要在界面 XML 描述或者 Component Hierarchy 面板选中该组件,然后用 Component Inspector 面板的 Handlers 标签页生成。

或者可以使用界面控制器顶部面板的 Generate Handler 按钮。

ContextHelpIconClickHandler

格式化器

为组件添加 formatter 实例。

下面示例中,我们演示为 formattedLabel1 标签使用 formatter

@Install(to = "formattedLabel", subject = "formatter")
protected String formattedLabelFormatter(String value) {
    return value.toUpperCase();
}

如需以编程的方式添加 formatter,使用组件的 addFormatter() 方法。

ValueChangeEvent

参阅 ValueChangeEvent

Label XML 属性

可以使用 Studio 界面设计器的 Component Inspector 面板查看和编辑组件的属性。

Label XML 元素