发布版本：COSMIC.V5.0.011

1 简介

1.1 功能介绍

• 提供数据驱动的纯展示表格，适用于自定义取数的表格展示场景，简化插件逻辑，提升开发效率

• 预置多种类型的数据列，一键配置数据格式

• 提供表格基本样式属性，一键配置选择列、序号列、行高自适应、前/背景色、字体样式

1.2 价值亮点

除原有单据体、单据列表控件外，新增无需绑定实体的轻量级【表格】控件，增强表格开发场景中的控件选型能力

1.3 使用场景

场景举例：“系统状态控制”页面需要用表格展示关键信息，该表格由插件自定义取数 

不同控件选型耗费的开发工作量：

 1.单据体/单据列表：除开发自定义取数外，还需要关联模型，处理很多单据体/单据列表的内置方法，并且需要额外处理动态列的元数据更新 

2.轻量表格：只需要传入标准的列数据和行数据就可渲染表格， 可快速简单的实现无实体的表格数据展示场景。

开发效率提升80%

1.4 系统路径

【开发平台】→【PC表单/动态表单】

2 功能速览

2.1 添加表格控件及数据列

在设计器中快速进行表格布局及常用属性配置

步骤1： 选择表格控件并添加入画布中

步骤2： 选中画布上的表格控件，为其添加数据列

可选数据列有“表格文本”、“表格整数”、“表格小数”、“表格日期”、“表格时间”、“表格金额”、“表格图片”、“操作列”

步骤3：常用属性及样式设置

常用属性：显示序号列、显示序号列、可见性、为零显示、小数精度、日期格式、时间格式等

常用样式：尺寸设置、字体设置、颜色设置、行高自适应等

2.2 插件开发

通过以上设计器配置，我们已经完成了表格的布局和基本属性配置，接下来只需通过插件传入标准的列数据与行数据，即可完成轻量表格的开发。在插件中，我们可以实现创建列干预和数据绑定的功能，见以下说明。

创建列干预

1. 首先需要在插件initialize方法中为表格控件注册列创建和绑定数据列监听事件； 

2. 动态创建列：表格控件列创建时触发创建列事件，插件需要实现BeforeCreateDataGridColumnsListener接口并重写beforeCreateDataGridColumns方法，从参数获取columns操作列集合进行自身的业务逻辑。

数据绑定

表格控件刷新时触发绑定数据，插件需要实现DataGridBindDataListener接口并重写dataGridBindData方法，通过参数setData设置自定义数据。本方法参数提供DataGridRowBuilder方便创建行数据。

代码示例如下

```java
/**
 * 动态创建列、数据绑定
 */
public class DataGridSamplePlugin extends AbstractFormPlugin implements DataGridBindDataListener, BeforeCreateDataGridColumnsListener {

    /**
     * 初始化为控件增加监听事件
     */
    @Override
    public void initialize() {
        DataGrid dataGrid = this.getControl("datagridap");
        // 注册创建列监听事件
        dataGrid.addBeforeCreateDataGridColumnsListener(this);
        // 注册绑定数据监听事件
        dataGrid.addBindDataListener(this);
    }

    /**
     * 监听创建列事件
     * @param event
     */
    @Override
    public void beforeCreateDataGridColumns(BeforeCreateDataGridColumnsEvent event) {
        // 所有列集合
        List<DataGridColumn> dataGridColumns = event.getDataGridColumns();
        // 动态创建文本列
        TextDataGridColumn column = new TextDataGridColumn();
        column.setKey("colKey");
        column.setCaption(new LocaleString("测试列"));
        // 加入列集合
        dataGridColumns.add(column);
    }

    /**
     * 数据绑定
     */
    @Override
    public void dataGridBindData(DataGridBindDataEvent e) {
        List<Object> list = new ArrayList<>();
        int index = 0;
        // 从参数获取rowBuilder来辅助构造行数据
        DataGridRowBuilder builder = e.getDataGridRowBuilder();
        for (int i = 0; i < 10; i++) {
            DataGridRow row = builder.buildRow();
            // rk和seq为系统保留字段(主键和序列号)，支持自定义传值
            row.setValue("rk", index);  // rk必须存在且唯一不能重复
            row.setValue("seq", index + 1);
            row.setValue("textfield", "文本列数据");
            row.setValue("colKey", "动态列数据");
            list.add(row.get());
            index++;
        }
        // 重要: 传递列表数据
        e.setData(list);
    }
}
```

3 苍穹表格类控件适用场景对比