3.5.2.1.22. 标签组件

在线示例

API 文档

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

该组件的 XML 名称是: label

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

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

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

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

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

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

  1. <label id="dynamicLabel"/>
  1. @Inject
  2. private Label dynamicLabel;
  3. @Subscribe
  4. protected void onInit(InitEvent event) {
  5. dynamicLabel.setValue("Some value");
  6. }

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

  1. <data>
  2. <instance id="customerDc" class="com.company.sales.entity.Customer" view="_local">
  3. <loader/>
  4. </instance>
  5. </data>
  6. <layout>
  7. <label dataContainer="customerDc" property="name"/>
  8. </layout>

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

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

标签样式

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

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

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

  1. 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