3.5.2.1.22. 标签组件

Label 组件可以展示静态文本或者实体属性值。

该组件的 XML 名称是: label

下面是使用从本地化消息包中获取文本来设置标签的例子:

<label value="msg://orders"/>

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

在网页端,如果 value 属性设置的文本长度超出width值,文件会被分为多行显示。因此,显示一个多行标签,可以通过设置标签 width值实现. 如果文本过长但是 width值未定,文本会被截取。

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

可以在界面控制器中设置标签的参数,前提是给标签控件设置一个 id,然后在界面控制器中获取它的引用:

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

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

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

<data>
    <instance id="customerDc" class="com.company.sales.entity.Customer" view="_local">
        <loader/>
    </instance>
</data>
<layout>
    <label dataContainer="customerDc" property="name"/>
</layout>

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

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

标签样式

在基于 Halo 主题的网页端, 可以通过 stylename 属性定义样式。在 XML 描述里或者在界面控制器中:

<label value="Label to be styled"
       stylename="colored"/>

通过代码设置样式时,选择 HaloTheme 类中以 LABEL_ 开头的常量:

label.setStyleName(HaloTheme.LABEL_COLORED);
  • bold - 加粗。适用于重要的或者需要突出显示的文本。

  • colored - 彩色文本。

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

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

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

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

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

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

  • no-margin - 不要默认边距。

  • spinner - 回旋样式。添加到空 Label 组件则可以创建一个可用于表示任务进行中(比如数据正在加载中…​)的旋转图标。

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


Label 组件的属性列表

align - css - dataContainer - datasource - description - descriptionAsHtml - enable - box.expandRatio - height - htmlEnabled - icon - id - property - stylename - value - visible - width

Label 组件的元素

formatter

Label 组件样式

bold - colored - failure - h1 - h2 - h3 - h4 - huge - large - light - no-margin - small - spinner - success - tiny

API

addValueChangeListener