富文本接口

日期 修改人 修改内容
2020年7月31日 黄金民 首次创建
2020年9月31日 王先胜 编辑内容

设计决策

  1. 实验报告的题的题干由富文本组件负责呈现,包含编辑模式和播放模式,编辑模式主要在实验编辑器中使用,播放模式主要在3D播放器和VR播放器中使用。
  2. 本次实验报告功能,富文本提供输入框和下拉选项框控件,支持编辑器态和播放态的展示。
  3. 实验报告的题目的答案部分通过富文本控件的扩展属性来存储,应用端可以获取扩展属性,并完成自己的业务,富文本不对扩展属性做业务逻辑。

数据定义

当前电压表

富文本数据定义:
本次测量的电压值为<input> {
    "Type": 0, // 下拉框
    "DefaultDropIndex": -1,
    "Tip": "可以下拉选择选项哦",
    "Width": 120,
    "Height": 30,
    "Extend": "答案-json",
    "DropItems": ["相同","相反","不确定"]
} </input>
本次测量的电压值为<input> {
    "Type": 1, // 输入框
    "AnswerText" "text",
    "Tip": "请按当前观察填写",
    "Width": 120,
    "Height": 30,
    "Extend": "答案-json"
} </input>
本次测量的电压值为<input> {
    "Type": 2, // 图片
    "Name" "tips.png",
    "Width": 100,
    "Height": 100,
    "Color": 0
} </input>此处兼容旧版格式<sprite n=tips.png w=100 h=100 c=white>
本次测量的电压值为<input> {
    "Type": 3, // 公式
    "Name" "formula.png",
    "Width": 100,
    "Height": 100,
    "Color": 0,
    "Latex": "a+b"
} </input>此处兼容旧版格式<formula n=formula.png w=100 h=100 c=white latex=a+b>
本次测量的电压值为<input> {
    "Type": 4, // 表格
    "JsonData" "text",
    "Width": 120,
    "Height": 30,
    "Extend": "答案-json"
} </input>
本次测量的电压值为<input> {
    "Type": 5, // 坐标图
    "JsonData" "text",
    "Width": 120,
    "Height": 30,
    "Extend": "答案-json"
} </input>

富文本属性数据定义:(可扩展属性配置)
<Attribute>{"Alignment":2,"SupportRTL":true}</Attribute>

数据模型


View关系类图


关键类图


接入方式

1、实验报告配置数据如下:
1、能够表明装置不漏气的现象是
:<Input>{"DropItems":["握住试管时,有气泡冒出;松开试管后,有水柱形成。握住试管时,有气泡冒出;松开试管后,有水柱形
成。","握住试管时,有气泡冒出","松开试管后,有水滴形成","握住试管时,有气泡连成串上浮握住试管时,有气泡连成串上浮握住试管时,有气泡连成串上
浮"],"DefaultDropIndex":-1,"Index":1,"Tip":"请根据此时的观察结果进行填写","Extend":null,"Width":300,"Height":40,"Type":1}</Input>2.本次测
量的电压值为 <Input>{"AnswerText":"","Index":2,"Tip":"请根据此时的观察结果进行填写","Extend":null,"Width":160,"Height":40,"Type":0}</Input> V,电流值为 
<Input>{"AnswerText":"","Index":3,"Tip":"请根据此时的观察结果进行填写","Extend":null,"Width":160,"Height":40,"Type":0}</Input> A。观察到电压和电流呈现 
<Input>{"DropItems":["相同","相反","不确定"],"DefaultDropIndex":-1,"Index":4,"Tip":"请根据此时的观察结果进行填
写","Extend":null,"Width":240,"Height":40,"Type":1}</Input><Input>{"Name":"solider1.png","Color":0,"Width":100,"Height":100,"Type":2}</Input>
<Input>{"Name":"formula.png","Color":0,"Width":166,"Height":40,"Type":3}</Input><Attribute>{"Alignment":0,"SupportRTL":true}</Attribute>

2、在需要显示富文本的节点添加实验室富文本组件(LabRichText),详细提供接口可见上面类图;调用显示富文本接口ShowRichText(string text),text就是上面1中的配置数据;

接口说明

编辑器

1、Action<BaseData> actionSetting

简要说明

点击设置回调,返回改控件数据,用于设置下拉框、输入框、公式数据对应修改

返回值

类型 说明
BaseData 控件数据

用例

labRichTextCmp.actionSetting = (data) => {
Debug.Log(“触发事件:请弹出设置界面”);
}

2、void ShowRichText(string text)

简要说明

显示富文本界面内容

参数

参数名 类型 说明
text string 富文本内容

3、void SaveCellData(BaseData cellData)

简要说明

下拉框、输入框、公式控件数据存储刷新,需要按不同类型进行强转后调用

参数

参数名 类型 说明
cellData BaseData 控件数据

用例

        btnReset.onClick.AddListener(() => {
            if (cellData == null) return;

            switch (cellData.Type) {
                case Enum.UIType.InputField:
                    InputData data1 = cellData as InputData;
                    data1.Tip = "我是输入框";
                    cellData = data1;
                    break;
                case Enum.UIType.DropDown:
                    DropdownData data2 = cellData as DropdownData;
                    data2.Tip = "我是下拉框";
                    cellData = data2;
                    break;
                case Enum.UIType.Formula:
                    ImageData data4 = cellData as ImageData;
                    data4.Color = Enum.ColorType.blue;
                    cellData = data4;
                    break;
                default:
                    break;
            }
            labRichTextEditor.SaveCellData(cellData);
        });

4、void CreateItem(UIType uIType = UIType.InputField, int width = 150, int height = 40, object param = null)

简要说明

创建单元格、图片、公式(回退删除单元格在组件refresh中处理,无需外部调用接口)

参数

参数名 类型 说明
uIType UIType 控件类型(输入框、下拉框、图片、公式、表格、绘图)
width int 宽度
height int 高度
param object 参数

5、string SaveRichText()

简要说明

保存富文本

返回值

类型 说明
string 富文本存储内容

3D播放器

1、Action<UIInputField3D> actionEnter

简要说明

悬停/点击输入框响应回调

返回值

类型 说明
UIInputField3D 输入框对象

用例

labRichTextCmp.actionEnter = (data) => {
Debug.Log(“触发事件:请显示数字输入框”);
}

2、void ShowRichText(string text)

简要说明

显示富文本界面内容

参数

参数名 类型 说明
text string 富文本内容

3、string SaveRichText()

简要说明

保存富文本

返回值

类型 说明
string 富文本存储内容

VR播放器

1、Action<UIInputFieldVR> actionEnter

简要说明

点击输入框回调,用于通知客户端显示数字输入框

返回值

类型 说明
UIInputFieldVR 文本对象

labRichTextCmp.actionEnter = (data) => {
Debug.Log(“触发事件:请显示数字输入框”);
data.SetValue(“6”);
}

2、Action<Vector2> actionSizeChanged

简要说明

下拉框显示大小变更回调,用于通知客户端自适应大小

返回值

类型 说明
Vector2 坐标位置

3、string SaveRichText()

简要说明

保存富文本

返回值

类型 说明
string 富文本存储内容

4、void ShowRichText(string text)

简要说明

显示富文本界面内容

参数

参数名 类型 说明
string text 富文本内容

5、void SaveCellData(BaseData cellData)

简要说明

显示富文本界面内容

参数

参数名 类型 说明
BaseData cellData 富文本数据

2、Action<TableItemData> SettingAnswerAction

简要说明

设置单元格答案

返回值

类型 说明
TableItemData 富文本单元格数据