3.5.2.1.45. 文本区

TextArea 是多行文本编辑字段。

该组件对应的 XML 名称: textArea

TextArea 的功能大部分与 TextField 组件相同,同时具有以下特有属性:

  • colsrows 设置文本的行数和列数:

    <textArea id="textArea" cols="20" rows="5" caption="msg://name"/>

    widthheight 的值优先于 colsrows 的值。

  • wordwrap - 将此属性设置为 false 以关闭自动换行。

    TextArea 支持在其父 TextInputField 接口中定义的 TextChangeListener。文本变化事件在输入时按顺序异步处理,不会阻塞输入。

    textArea.addTextChangeListener(event -> {
        int length = event.getText().length();
        textAreaLabel.setValue(length + " of " + textArea.getMaxLength());
    });
gui TextArea 2
  • textChangeEventMode 定义文本的变化被发送到服务器并触发服务端事件的方式。有 3 种预定义的事件模式:

    • LAZY (默认) - 文件输入暂停时触发事件。暂停时间可以通过 setTextChangeTimeout() 或者textChangeTimeout 属性修改。即使用户在输入文本时没有发生暂停,也会在可能发生的 ValueChangeEvent 之前强制触发文本更改事件。

    • TIMEOUT - 超时后触发事件。如果在超时周期内进行了多次更改,则将周期内自最后一次更改后发生的更改发送到服务端。可以使用 setTextChangeTimeout() 或者textChangeTimeout 属性设置超时时长。

      如果在超时期限之前发生 ValueChangeEvent,则在它之前触发 TextChangeEvent,条件是文本内容自上一个 TextChangeEvent 以来已经发生改变。

    • EAGER - 对于文本内容的每次更改,都会立即触发事件,通常是由按键触发。请求是独立且一个接一个地顺序处理。文本变化事件以异步方式与服务器交互,因此可以在处理事件请求的同时继续输入。

  • textChangeTimeouttextChangeEventModeLAZYTIMEOUT 时,定义编辑文本时暂停的时间或者超时时间。

    TextArea 样式

    Web Client 使用 Halo-based 主题时,在 XML 描述或者界面控制器中可以使用 stylename 属性给 TextArea 组件设置预定义的样式:

    <textArea id="textArea"
              stylename="borderless"/>

    如果使用编程的方式设置样式,可以选择一个前缀为 TEXTFIELD_HaloTheme class 常量:

    textArea.setStyleName(HaloTheme.TEXTAREA_BORDERLESS);
    • align-center - 使文本在文本区中居中显示。

    • align-right - 使文本在文本区中居右显示。

    • borderless - 移除文本区的边框和背景。