表格组件wiki

简要描述:

  • 为虚拟实验室编辑器和播放器数的据处理、实验报告模块提供表格支持

# 组件接口说明:

创建表格:

NDUGUITable CreateTable(Transform parent ,TableProperty property, TableVisibleInfo tvi)

参数:

参数名 类型 说明
parent Transform 表格挂载点
property TableProperty 表格属性
tvi TableVisibleInfo 表格可视化数据信息

返回值说明:

类型 说明
NDUGUITable 表格对象

清除单元格数据:

void ClearnCell(NDBaseCell cell)

参数:

参数名 类型 说明
cell NDBaseCell 待清除数据的单元格

返回值说明:

  • void

在指定索引位置,左侧插入列:

void InsertColumnToLeft(int cIndex)

参数:

参数名 类型 说明
cIndex int 索引值

返回值说明:

  • void

在指定索引位置,右侧插入列:

void InsertColumnToRight(int index)

参数:

参数名 类型 说明
index int 索引值

返回值说明:

  • void

在指定索引的下方插入行:

void InsertRowToDown(int index)

参数:

参数名 类型 说明
index int 索引值

返回值说明:

  • void

指定索引位置上方插入行:

void InsertRowToUp(int rIndex)

参数:

参数名 类型 说明
rIndex int 索引值

返回值说明:

  • void

删除行:

void DltRow(int rIndex)

参数:

参数名 类型 说明
rIndex int 索引值

返回值说明:

  • void

删除列:

void DltColumn(int cIndex)

参数:

参数名 类型 说明
cIndex int 索引值

返回值说明:

  • void

合并单元格:

NDBaseCell MergeCells(NDTableCell _leftTopCell, NDTableCell _rightBottomCell)

参数:

参数名 类型 说明
_leftTopCell NDTableCell 左上角单元格
_rightBottomCell NDTableCell 右下角单元格

返回值说明:

类型 说明
NDBaseCell 合并单元格

拆分单元格:

void SplitCell(NDComplexCell cell)

参数:

参数名 类型 说明
cell NDComplexCell 待拆分的合并单元格

返回值说明:

  • void

设置切分样式:

void SetCellStyle(NDBaseCell cell, CellStyleType style)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格
style CellStyleType 单元格风格样式

返回值说明:

  • void

读表格数据:

CellCustomData GetCellData(NDBaseCell cell)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格

返回值说明:

类型 说明
CellCustomData 单元格数据对象

写表格数据:

void SetCellData(NDBaseCell cell, CellCustomData customData)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格
customData CellCustomData 单元格数据

返回值说明:

  • void

读表格数据配置【用于下拉输入】:

CellCustomData GetCellDropDownData(NDBaseCell c)

参数:

参数名 类型 说明
c NDBaseCell 目标单元格

返回值说明:

类型 说明
CellCustomData 数据对象

写表格数据配置【用于下拉输入】:

void SetDropDownCellData(NDBaseCell cell, List<string> info, int curIndex = 0)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格
info List<string> 下拉框数据列表(按默认顺序)
curIndex int 当前选中索引

返回值说明:

  • void

读表格公式:

string GetCellFormula(NDBaseCell cell)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格

返回值说明:

类型 说明
string 单元格中的公式

写表格公式:

bool SetFormula((NDBaseCell cell, string formula)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格
formula string 公式字符串

返回值说明:

类型 说明
bool 插入公式是否合法

触发公式计算:

void OperateFormula()

参数:

返回值说明:

  • void

序列化:

string TableToJson(NDUGUITable table)

参数:

参数名 类型 说明
table NDUGUITable 目标表格对象

返回值说明:

类型 说明
string 序列化之后的json字符串

反序列化:

NDUGUITable CreateTableByJson(Transform parent,string json)

参数:

参数名 类型 说明
parent Transform 表格对象挂载点
json string 序列化字符串

返回值说明:

类型 说明
NDUGUITable 表格对象

设置表头:

void SetTableHead(CellLogicType type,int index)

参数:

参数名 类型 说明
type CellLogicType 表头类型:行表头or 列表头
index int 表头索引值

返回值说明:

-void

获取指定表头所在行or列的所有没有被单元格,包括被合并的单元格:

List<NDBaseCell> GetHeadValues(CellLogicType type, int headIndex)

参数:

参数名 类型 说明
type CellLogicType 表头类型
headIndex int 表头索引值

返回值说明:

类型 说明
List<NDBaseCell> 表头索引下的所有单元格数组

获取所有数据单元格,包含被合并的:

List<NDBaseCell> GetAllCells()

参数:

返回值说明:

类型 说明
List<NDBaseCell> 单元格对象列表

通过GUID获取单元格:

NDBaseCell GetCellByGuid(string guid)

参数:

参数名 类型 说明
guid string 表头类型

返回值说明:

类型 说明
NDBaseCell 满足要求的单元格or null

编辑器表格数据反序列化为播放器表格(没有索引行列):

NDUGUITable CreatePlayerTableByJson(Transform parent, string json)

参数:

参数名 类型 说明
parent Transform 表格对象挂载点
json string 序列化字符串

返回值说明:

类型 说明
NDUGUITable 表格对象

通过普通单元格获取它所属的合并单元格:

NDComplexCell GetComplexCell(NDBaseCell cell)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格

返回值说明:

类型 说明
NDUGUITable 所属的合并单元格,如果不存在返回null

单元格设置答案:

void SetAnswerForCell(NDBaseCell cell, CellAnswerData answerData)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格
answerData CellAnswerData 答案数据结构

返回值说明:

-void

获取单元格答案数据:

CellAnswerData GetCellAnswerData(NDBaseCell cell)

参数:

参数名 类型 说明
cell NDBaseCell 目标单元格

返回值说明:

类型 说明
CellAnswerData 所属单元格的答案类型数据结构

# 编辑器表格用例图:

编辑器表格用例图

# 播放器表格组件用例图:

播放器表格组件用例图

# 表格组件架构图:

表格组件架构图

# 表格数据结构定义:

单元格信息:

/// <summary>
/// 单元格信息
/// </summary>
public class TableCellInfo
{
    /// <summary>
    /// 唯一标识
    /// </summary>
    public string GUID;
    /// <summary>
    /// 单元格尺寸
    /// </summary>
    public Vector2 Size;

    /// <summary>
    /// 坐标
    /// </summary>
    public Vector3 AnchoredPostion;

    /// <summary>
    /// 索引
    /// </summary>
    public Vector2Int Index;

    /// <summary>
    /// 逻辑类型
    /// </summary>
    public CellLogicType LogicType;
    /// <summary>
    /// 构造类型
    /// </summary>
    public CellStructType StructType;
    /// <summary>
    /// 风格类型
    /// </summary>
    public CellStyleType StyleType;

    /// <summary>
    /// 数据
    /// </summary>
    public CellCustomData CustomData;

    /// <summary>
    /// 是否设置了答案
    /// </summary>
    public bool IsSetAnswer = false;

    /// <summary>
    /// 答案数据
    /// </summary>
    public CellAnswerData AnswerData;
}

表格属性:

/// <summary>
/// 表格基本属性
/// </summary>
public class TableProperty
{
    /// <summary>
    /// 表格类型
    /// </summary>
    public TableStyle TBType;

    /// <summary>
    /// 表名
    /// </summary>
    public string TableName;

    /// <summary>
    /// 行列,X是行, Y是列
    /// </summary>
    public Vector2Int Ranks;

    /// <summary>
    /// 表格支持的最大行数
    /// </summary>
    public int MaxRow;

    /// <summary>
    /// 表格支持的最大列数
    /// </summary>
    public int MaxColumn;

    /// <summary>
    /// 设定的图表最大高度
    /// </summary>
    public float MaxHeight;

    /// <summary>
    /// 图表最大宽度
    /// </summary>
    public float MaxWidth;

    /// <summary>
    /// 单元格之间的间距
    /// </summary>
    public float Spacing;

    /// <summary>
    /// 行高,行宽
    /// </summary>
    public Vector2 CellSize;

    /// <summary>
    /// 单元格最大宽度;
    /// </summary>
    public float CellMaxWidth;

    /// <summary>
    /// 单元格最大高度
    /// </summary>
    public float CellMaxHeight;

    /// <summary>
    /// 最小宽度
    /// </summary>
    public float CellMinWidth;

    /// <summary>
    /// 最小高度
    /// </summary>
    public float CellMinHeight;

    /// <summary>
    /// 列索引行高
    /// </summary>
    public float ColumnIndexSpace = 50;

    /// <summary>
    /// 行索引行宽
    /// </summary>
    public float RowIndexSpace = 50;
}

表格可视化数据结构:

/// <summary>
/// 表格可视化数据
/// </summary>
public class TableVisibleInfo
{
    /// <summary>
    /// 表格背景颜色,体现在单元格的分割线上
    /// </summary>
    public Color TableBgColor = Color.black;

    /// <summary>
    /// 表头单元格颜色
    /// </summary>
    public Color HeadColor = new Color(246.0f / 255, 216f / 255f, 152f / 255);

    /// <summary>
    /// 单元格字体颜色
    /// </summary>
    public Color TextColor = Color.black;

    /// <summary>
    /// 设置了答案的下拉列表内容字体颜色
    /// </summary>
    public Color DropdownTextColorForAnswer = Color.black;

    /// <summary>
    /// 单元格背景颜色
    /// </summary>
    public Color CellBgColor = Color.white;

    /// <summary>
    /// 单元格背景颜色
    /// </summary>
    public Color ChoosedBgColor = Color.yellow;

    /// <summary>
    /// 索引行单元格背景颜色
    /// </summary>
    public Color RowIndexCellBgColor = Color.white;

    /// <summary>
    /// 索引列单元格背景颜色
    /// </summary>
    public Color ColumnIndexCellBgColor = Color.white;

    /// <summary>
    /// 索引单元格被选中颜色
    /// </summary>
    public Color IndexCellChoosedColor = Color.gray;

    /// <summary>
    /// 单元格字体尺寸
    /// </summary>
    public int FontSize = 14;

    /// <summary>
    /// 字体
    /// </summary>
    public Font Font;

    /// <summary>
    /// 单元格背景
    /// </summary>
    public Sprite SprCellBg;

    /// <summary>
    /// 单元格框选背景
    /// </summary>
    public Sprite SprRectFocus;

    /// <summary>
    /// 单元格选中边框
    /// </summary>
    public Sprite SprCellFocus;

    /// <summary>
    /// 列操作光标UI
    /// </summary>
    public Sprite SprColumnCursor;

    /// <summary>
    /// 行操作光标UI
    /// </summary>
    public Sprite SprRowCursor;

    /// <summary>
    /// 列调节操作杆UI
    /// </summary>
    public Sprite SprCursor_Column;

    /// <summary>
    /// 行调节操作杆UI
    /// </summary>
    public Sprite SprCursor_Row;

    /// <summary>
    /// 下拉框三角形图标
    /// </summary>
    public Sprite SprDropArrow;

    /// <summary>
    /// 公式图标
    /// </summary>
    public Sprite SprFormula;

    /// <summary>
    /// 表格左上角图标
    /// </summary>
    public Sprite SprLeftBg;

    /// <summary>
    /// 索引单元格字体大小
    /// </summary>
    public int IndexCellFontSize = 14;

    /// <summary>
    /// 表头字体大小
    /// </summary>
    public int HeadCellFontSize = 14;

    /// <summary>
    /// 表头字体颜色
    /// </summary>
    public Color HeadCellFontColor = new Color(0.5f,0.5f,0.5f,1);

    /// <summary>
    /// 下拉框的选项颜色
    /// </summary>
    public Sprite DropListItemBg;

    /// <summary>
    /// 下拉框选项列表背景图片
    /// </summary>
    public Sprite DropListBg;

    /// <summary>
    /// 公式计算时候的闪图
    /// </summary>
    public Sprite SprFormulaFlash;

    /// <summary>
    /// 公式计算时候的闪图显示时间
    /// </summary>
    public float FormulaFlashShowTime = 0.5f;

    /// <summary>
    /// 滑动条背景图片
    /// </summary>
    public Sprite ScrbarBg;

    /// <summary>
    /// 滑动条前景图片
    /// </summary>
    public Sprite ScrbarHandleBg;

    /// <summary>
    /// 滑动条背景颜色
    /// </summary>
    public Color ScrbarBgColor = Color.white;

    /// <summary>
    /// 滑动条前景颜色
    /// </summary>
    public Color ScrbarHandleBgColor = Color.white;

    /// <summary>
    /// 滑动条禁用图标
    /// </summary>
    public Sprite SprScrbarDisabled;

    /// <summary>
    /// 滑动条高亮图标
    /// </summary>
    public Sprite SprScrbarHighlighted;

    /// <summary>
    /// 滑动条按压图标
    /// </summary>
    public Sprite SprScrbarPressed;

    /// <summary>
    /// 下拉框子项禁用图标
    /// </summary>
    public Sprite SprDropDownItemDisabled;

    /// <summary>
    /// 下拉框子项高亮图标
    /// </summary>
    public Sprite SprDropDownItemHighlighted;

    /// <summary>
    /// 下拉框子项按压图标
    /// </summary>
    public Sprite SprDropDownItemPressed;

    /// <summary>
    /// 下拉框子项选中图标
    /// </summary>
    public Sprite SprDropDownItemChoosed;

    /// <summary>
    /// 输入框文本长度限制
    /// </summary>
    public int IptChLimit = 0;

    /// <summary>
    /// 设置答案图标
    /// </summary>
    public Sprite SprAnswer;

}