1.12. 流程编辑
VRP 3D引擎的脚本编辑器主要用来设置VR场景的强大交互功能。用户可以根据项目需求通过脚本语句来设置场景丰富的交互功能。交互功能是虚拟现实的一个重要特征。
一、图形化编辑¶
（一）界面介绍¶
1-----搜索，可搜索对应的编辑图块。
2-----编辑图块的分类。
3-----添加对象，可将场景中的对象添加到此处进行编辑。
操作步骤：
①单击该按钮后出现如下界面。
②左侧大纲处选择要添加的对象，选中后单击右侧添加按钮，即可添加对象。
4-----剧本名称，点击“
”可添加不同剧本，剧本间可随意切换。
5-----撤销与恢复按钮，编辑界面缩放级，以及图块对齐。
（二）脚本类型及使用技巧¶
脚本类型
当前脚本类型有逻辑、文本、变量、模型、相机、动画、UI、角色、运行库以及工业。
不同类型的脚本均有预设的编辑图块，可直接拖动至编辑面板使用。
文本类型的脚本可根据需要创建自定义文本及数值，当前支持用文本代替模型名称、位置数值、颜色等信息，进行后续逻辑操作。
变量类型的脚本可根据需要创建自定义脚本，当前支持用变量获取到场景中物体的三维信息，然后赋值给该变量，再进行后续逻辑操作。
使用技巧
1.若编辑图块添加错误需要删除，将对应图块拖至左侧垃圾桶即可。垃圾桶默认隐藏，拖动编辑图块时即可显示。
2.在编辑图块上单击右键，可显示右键菜单，包含有“克隆”、“折叠块”、“禁用块”、“删除块”等。
3.添加对象后，单击右键，可对对象进行“删除”、“重命名”等操作。
5.点击剧本后如图所示红框位置，可以对剧本进行“删除”、“重命名”等操作。
（三）图形编辑器使用示例¶
普通隐藏案例
下面通过隐藏模型的案例来说明图形编辑器的基本逻辑使用方法：
1.单击“窗口＞故事创作”，或者单击底部快捷栏“故事”，即可打开图形编辑器，如下图。
2.创建一个立方体作为示例物体。
3.在“故事创作”界面中，选择“逻辑”分类，将对应逻辑图块拖入右侧编辑面板。并填写点击的示例物体名称，如图所示。
4.选择“模型”分类，将“隐藏模型”逻辑块拖动到右侧面板，并填写点击的示例物体名称，如图所示。
5.关闭图形编辑器。
6.单击工具栏的
播放按钮即可查看。
视频播放案例
下面通过在线播放视频的案例来说明图形编辑器的二维UI使用方法。
1.在新场景中导入想要播放的视频，可以在“资源目录>文件”中看到已经导入的视频。
2.在底部快捷栏选择“故事创作”，在左侧“UI栏”中选择“播放在线视频，视频名称：”的图形模块拖入右侧，并在文本图形模块处，添加要播放在线视频的视频名称：vrp.mp4。
3.最后关闭“故事创作”，在工具栏中点击播放按钮“”，可以看到想要播放的视频正在播放。
4.点击播放视频处全屏预览键可以全屏预览视频。
二、流程编辑器¶
（一）流程编辑器介绍¶
单击“窗口＞故事创作”，在弹出的界面中选择流程编辑页面，如图所示。
（二）流程编辑器使用示例¶
下面通过隐藏模型的案例来说明流程编辑的使用方法：
1.新建两个三维物体“立方体”和“球”。
2.单击“窗口＞故事创作”，即可打开图形编辑器，选择第二个页签，如图所示。
3.选择“新建步骤”按钮，添加步骤1和步骤2 ，如图所示。
4.选择“初始化”，故事创作界面右侧单击操作，将交互物体设置为“Box”，下一步骤设置为“步骤1”。
5.选择步骤1，单击脚本，选择“模型＞隐藏模型”。
6.在模型名称处选择要进行编辑的模型，选择“Box”，单击“确定”，然后单击“添加”。
7.选择“步骤1”，故事创作界面右侧单击操作，将交互物体设置为“Sphere”，下一步骤设置为“步骤2”。
8.以相同的操作编辑步骤2的脚本内容。结果如图。编辑完成后关闭图形化编程窗口。
9.单击工具栏的
播放按钮即可查看模型被隐藏的场景。此场景中，当Box开始闪烁时，单击该物体会被隐藏；之后Sphere开始闪烁，单击该物体会被隐藏。
三、流程编辑功能实例¶
（一）简单流程编辑功能应用实例¶
以点击按键发射烟花到绽放过程为例，进行流程编辑功能的使用示范。
1.导入“图形化编程烟花教材案例”模型。
2.解释目前隐藏起来的“烟花”模型中的子节点。
①“烟花花球”子节点。
此处“烟花花球”是烟花绽放的样子，烟花绽放一般都是在一定高度上才会绽放。因此给模型在Y轴（向上的轴）上一定数值。
②“烟花尾焰”子节点。
因为烟花从发射到绽放需要一个发射过程，所谓发射工程就是模型要从最初位置移动到绽放的位置。所以此处“烟花尾焰”模型是在最初位置。
③“烟花发光”子节点。
此处“烟花发光”子节点为一个点光源，烟花绽放会发光，所以此“烟花发光”模型的位置与“烟花花球”模型位置相同。
3.在“窗口”中打开“故事创作”。
4.开始使用流程编辑功能。
①要设定按下什么键，烟花开始发射到绽放。
从左侧逻辑分类中找到“当按下的键为”的图形模块，拖入右侧空白处。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加按键文本。
②按下按键后，原本隐藏起来的烟花尾焰需要显示出来。
从左侧模型分类中找到“显示模型，模型名称：”的图形模块，拖入右侧空白处。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加要显示的模型名称。或者直接从大纲中选择要显示的模型，直接拖入右侧空白处。
③烟花尾焰模型只是显示还不行，发射过程是由下向上移动的过程。
从左侧动画分类中找到“播放位移动画（根据起始位置），模型名称：起始位置：目标位置：时间：坐标系：”的图形模块，拖入右侧空白处。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加要显示的模型名称。
从左侧文本分类中找到可以添加位置坐标的图形模块“
”，拖入右侧空白处，并添加起始位置坐标：“0.0.0”。选择起始位置坐标的图形模块，右键克隆，得到一块一样的位置坐标，添加目标位置坐标：“0.20.0”。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加时间：2000，单位毫秒。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加坐标系“0”，0代表世界坐标系。
④烟花尾焰模型从发射到绽放位置需要2000毫秒，在2000毫秒后烟花尾焰模型要隐藏，烟花花球模型和烟花发光模型需要显示。
从左侧逻辑分类中找到“执行等待时间”的图形模块，拖入右侧空白处。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加时间：2000，单位毫秒。
从左侧模型分类中找到“隐藏模型，模型名称：”的图形模块，拖入右侧空白处，并添加需要隐藏模型的名称。
从左侧模型分类中找到“显示模型，模型名称：”的图形模块，拖入右侧空白处，并添加需要显示模型的名称。
⑤烟花绽放大约持续100毫秒后消失。
从左侧逻辑分类中找到“执行等待时间”的图形模块，拖入右侧空白处。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加时间：100，单位毫秒。
从左侧模型分类中找到“隐藏模型，模型名称：”的图形模块，拖入右侧空白处，并添加需要隐藏模型的名称。
⑥在烟花花球消失后光还会持续约1000毫秒的时间才会消失。
从左侧逻辑分类中找到“执行等待时间”的图形模块，拖入右侧空白处。
从左侧文本分类中找到可以添加文本的图形模块“
”，拖入右侧空白处，并添加时间：1000，单位毫秒。
从左侧模型分类中找到“隐藏模型，模型名称：”的图形模块，拖入右侧空白处，并添加需要隐藏模型的名称。
⑦流程编辑完成。
5.在工具栏中点击播放按钮“
”，按下“b”键，开始发射烟花。
（二）复杂流程编辑功能应用实例¶
以车辆展示为例，进行流程编辑功能的使用示范。
案例里包含了已经布置完成的UI界面，目前需要进行流程编辑才能达到按下不同的UI按键得到不同的效果。
整个案例我们可以分为六大类，①按下“参数配置”按键，视口区域右侧出现车辆配置参数面板;②按下“环绕视角/视角01/视角02/视角03”按键，每个按键展现车辆不同位置的视角;③按下“启动/停止”按键，车辆开始移动/停止。④按下车辆车身能随机改变车身颜色;⑤按下车辆前大灯，大灯发光;⑥按下车辆后尾灯，尾灯发光。
1.导入图形化编程车辆展示教材案例。
2.开始进行第一大类流程编辑。按下“参数配置”按键，视口区域右侧出现车辆配置参数面板。
①我们要的效果是第一次按下“参数配置”按键时，视口区域右侧出现车辆配置参数面板，再次按下“参数配置”按键时，视口区域右侧隐藏车辆配置参数面板。
②这就需要一个判断的模块，判断此时是显示还是隐藏。因此在变量栏中选择“创建变量”，创建“ParameterLabel（参数标签）”得到相对应的模块。选择“赋值ParameterLabel为”的模块，拖入右侧空白处，并在文本栏中选择“0”的模块“
”，拖入右侧空白处与“赋值ParameterLabel为”的模块形成：“赋值ParameterLabel为0”的前提。
③在逻辑栏中选择“当点击的UI为”的模块，拖入右侧空白处，并从大纲中选择“参数配置”按键的模型“Parameter_Button”，直接拖入右侧空白处与“当点击的UI为”的模块形成：“当点击的UI为Parameter_Button”。
④在UI栏中选择“显示隐藏UI控件，UI控件名： UI显示隐藏： ”的模块，拖入右侧空白处，并从大纲中选择“车辆配置参数面板”的模型“Parameter_Label”，直接拖入右侧空白处与“显示隐藏UI控件，UI控件名： UI显示隐藏： ”的模块及文本栏中选择“0”的模块“
”形成：“显示隐藏UI控件，UI控件名：Parameter_Label UI显示隐藏：0”。
⑤选择“赋值ParameterLabel为0”的模块，右键克隆，得到一模一样的模块放入显示隐藏UI控件，UI控件名：Parameter_Label UI显示隐藏：0”模块下面合并。
⑥同理选择合并好的“显示隐藏UI控件，UI控件名：Parameter_Label UI显示隐藏：0 赋值ParameterLabel为0”模块右键克隆，得到另一个一模一样的模块，更改“UI显示隐藏：0”为“UI显示隐藏：1”，“赋值ParameterLabel为0”为“赋值ParameterLabel为1”。形成“显示隐藏UI控件，UI控件名：Parameter_Label UI显示隐藏：1 赋值ParameterLabel为1”的模块。
⑦在逻辑栏中选择“如果： 执行： 否则： ”的模块，拖入右侧空白处，在变量栏中“ParameterLabel”模块并入“如果”处。将“显示隐藏UI控件，UI控件名：Parameter_Label UI显示隐藏：0 赋值ParameterLabel为0”模块并入“执行”处。将“显示隐藏UI控件，UI控件名：Parameter_Label UI显示隐藏：1 赋值ParameterLabel为1”模块并入“否则”处。
⑧整体思路为：先“赋值ParameterLabel为0”，当按下“参数配置”按键时也就是流程编辑器中的“当点击的UI为Parameter_Button”，此时“ParameterLabel为0”所以执行的是“否则”处的条件：显示“参数面板”，并且将“ParameterLabel为0”重新赋值“赋值ParameterLabel为1”。此时再按下“参数配置”按键时“ParameterLabel为1”，所以执行的是“执行”处的条件：隐藏“参数面板”，并且将“ParameterLabel为1”重新赋值“赋值ParameterLabel为0”。如此循环往复，当“ParameterLabel为1”时是显示参数面板，当“ParameterLabel为0”时是隐藏参数面板。
⑨效果完成。
3.开始进行第二大类流程编辑。按下“环绕视角/视角01/视角02/视角03”按键，每个按键展现车辆不同位置的视角。
①不同相机不同视角不同参数。
环绕视角参数
视角01参数
其他视角相机参数基本同上 ②在相机栏中，选择“绑定跟随相机，跟踪物体名称： 相机距离： 高度： ”的模块，拖入右侧空白处。在大纲中选择“RotateCamera（环绕视角）”模型拖入右侧空白处与文本类中可以添加文本的图形模块“
”并入“绑定跟随相机，跟踪物体名称： 相机距离： 高度： ”模块中，形成：“绑定跟随相机，跟踪物体名称：RotateCamera相机距离：0高度：0”。
③在逻辑栏中选择“当点击的UI为”的模块，拖入右侧空白处，并从大纲中选择“环绕视角”按键的模型“RotateCamera_Button”，直接拖入右侧空白处与“当点击的UI为”的模块形成：“当点击的UI为RotateCamera_Button”。 ④选择“绑定跟随相机，跟踪物体名称：RotateCamera相机距离：0高度：0”模块，右键克隆，得到一模一样的模块。并入“当点击的UI为RotateCamera_Button”的模块之下，形成：“当点击的UI为RotateCamera_Button，绑定跟随相机，跟踪物体名称：RotateCamera相机距离：0高度：0”。
⑤同理将“当点击的UI为RotateCamera_Button，绑定跟随相机，跟踪物体名称：RotateCamera相机距离：0高度：0”的合并模块，右键克隆几次，得到3个一模一样逻辑的合并模块，更改按下的UI按键名称为各自视角UI按键模型名称，并将“绑定跟随相机，跟踪物体名称：”处也更改为各自视角相机名称。
⑥整体思路为：开始视角定为环绕视角，当按下“视角01”时，出现视角01的视角。当按下“视角02”时，出现视角02的视角。同理，按下什么视角的按键，画面出现的就是什么视角。
⑦效果完成。
环绕视角
视角01
视角02
视角03
4.开始进行第三大类流程编辑。按下“启动/停止”按键，车辆开始移动/停止。 ①涉及到要让车辆动起来，首先需要车辆的轮胎都有一个动起来的动画，且除车辆以外还需要环境动起来的动画，以及车辆驾驶座上人物对方向盘的摆动动画。这四个动画在场景中已经存在了，分别是环境动画“001”，左前轮动画“左前轮”，右前轮动画“右前轮”，后轮动画“后轮”，驾驶员动画“Driving”。
②在逻辑栏中选择“当点击的UI为”的模块，拖入右侧空白处，并从大纲中选择“启动”按键的模型“StartButton”，直接拖入右侧空白处与“当点击的UI为”的模块形成：“当点击的UI为StartButton”。
③在动画栏中选择“播放动画（指定播放模式），模型名称： 动画片段： 播放速度： 播放模式： ”的模块，拖入右侧空白处，在文本类选择可以添加文本的图形模块“
”，填上动画模型名称及动画片段名称、播放速度、播放模式。
④将四个播放动画的合并模块一起并入“当点击的UI为StartButton”的模块之下，达到按下“启动”按键开始播放动画。车辆开始移动。
⑤在逻辑栏中选择“当点击的UI为”的模块，拖入右侧空白处，并从大纲中选择“停止”按键的模型“SpotButton”，直接拖入右侧空白处与“当点击的UI为”的模块，形成：“当点击的UI为SpotButton”。
⑥在动画栏中选择“暂停动画，模型名称： ”模块，拖入右侧空白处，并从大纲中选择各自带有动画的模型，直接拖入右侧空白处与“暂停动画，模型名称： ”模块合并，形成：“暂停动画，模型名称：001/左前轮/右前轮/Driving”。
⑦将四个暂停动画的合并模块一起并入“当点击的UI为SpotButton”的模块之下，达到按下“停止”按键开始暂停动画。车辆停止移动。
⑧效果完成。
按下启动键
按下停止键
5.开始进行第四大类流程编辑。按下车辆车身能随机改变车身颜色 ①在逻辑栏中选择“当左键按下时，点击的物体为：”的模块，拖入右侧空白处，并从大纲中选择“车壳”模型，拖入右侧空白处与“当左键按下时，点击的物体为：”的模块，形成：“当左键按下时，点击的物体为：车壳”。
②在模型栏中选择“设置模型颜色，模型名称： 模型颜色： ”的模块，拖入右侧空白处，在文本栏中选择“【 ， ，】”的模块“
”，并从逻辑栏中选择两个数值可以进行运算的模块“
”。因为颜色由RGB三个数值控制的，所以还要从文本栏中选择“随机小数”模块“
”，以及数值“0”模块“
”。由随机小数模块和数值模块一起并入运算模块中，形成“随机小数*255”模块，再一同并入“
”模块中，形成三个随机数值。
③将大纲中选择“车壳”模型拖入右侧空白处与“设置模型颜色，模型名称： 模型颜色： ”模块和“
”模块一起合并。形成：“设置模型颜色，模型名称：车壳 模型颜色：随机小数*255，随机小数*255，随机小数*255”。
④将“设置模型颜色，模型名称：车壳 模型颜色：随机小数*255，随机小数*255，随机小数*255”合成模块并入“当左键按下时，点击的物体为：车壳”模块之下，形成：“当左键按下时，点击的物体为：车壳 设置模型颜色，模型名称：车壳 模型颜色：随机小数*255，随机小数*255，随机小数*255”。
⑤整体思路为：按下“车壳”，车壳随机变换成另一种颜色。
⑥效果完成。
点击车壳
6.开始进行第五大类流程编辑。按下车辆前大灯，大灯发光。
①我们要的效果是第一次按下“前大灯灯罩”，大灯发光，再次按下“前大灯灯罩”，大灯熄灭。这需要一个判断的模块，判断此时是显示还是隐藏。因此在变量栏中选择“创建变量”，创建“FrontLight（前灯）”得到相对应的模块。选择“赋值FrontLight为”的模块，拖入右侧空白处，并在文本栏中选择“0”的模块“
”，拖入右侧空白处改为“1”，并与“赋值FrontLight为”的模块形成：“赋值FrontLight为1”的前提。
②在逻辑栏中选择“当左键按下时，点击的物体为：”的模块，拖入右侧空白处，并从大纲中选择“前大灯灯罩”模型，拖入右侧空白处与“当左键按下时，点击的物体为：”的模块，形成：“当左键按下时，点击的物体为：前大灯灯罩”。
③在模型栏中选择“显示—隐藏模型，模型名称： 显示或隐藏：”的模块，拖入右侧空白处，并从大纲中选择“大灯灯光”模型，拖入右侧空白处并与变量栏中“FrontLight”模块一起并入“显示—隐藏模型，模型名称： 显示或隐藏：”的模块，形成：“显示—隐藏模型，模型名称：大灯灯光 显示或隐藏：FrontLight”。
③在变量栏中选择“赋值FrontLight为”的模块和“FrontLight”模块，拖入右侧空白处。在逻辑栏中选择两个数值可以进行运算的模块“
”拖入右侧空白处与更改文本栏中数值“0”模块为“1”的模块合并成：“1-FrontLight值”“
”的合成模块。再将此合成模块并入“赋值FrontLight为”的模块中，形成：“赋值FrontLight为“1-FrontLight值””。
④最后将三个合成模块按照逻辑合并在一起，形成：“当左键按下时，点击的物体为：前大灯灯罩 显示—隐藏模型，模型名称：大灯灯光 显示或隐藏：FrontLight 赋值FrontLight为“1-FrontLight值””。
⑤整体思路为：当按下前大灯灯罩时，大灯发光，此时FrontLight值为1，为显示大灯灯光。然后又赋值FrontLight为1-1=0，所以再次按下大灯灯罩时，大灯熄灭，此时FrontLight值为0，为隐藏大灯灯光。
⑥效果完成。
第一次按下大灯灯罩
第二次按下大灯灯罩
7.开始进行第六大类流程编辑。按下车辆后尾灯，尾灯发光。
①我们要的效果是第一次按下“尾灯玻璃”，尾灯发光，再次按下“尾灯玻璃”，尾灯熄灭。这需要一个判断的模块，判断此时是显示还是隐藏。因此在变量栏中选择“创建变量”，创建“BackLight（尾灯）”得到相对应的模块。选择“赋值BackLight为”的模块，拖入右侧空白处，并在文本栏中选择“0”的模块“
”，拖入右侧空白处改为“1”，并与“赋值BackLight为”的模块形成：“赋值BackLight为1”的前提。
②在逻辑栏中选择“当左键按下时，点击的物体为：”的模块，拖入右侧空白处，并从大纲中选择“尾灯玻璃”模型，拖入右侧空白处与“当左键按下时，点击的物体为：”的模块，形成：“当左键按下时，点击的物体为：尾灯玻璃”。
③在模型栏中选择“设置模型自发光，模型名称： 自发光： 自发光颜色： 强度： ”的模块，拖入右侧空白处。从大纲中选择“尾灯外圈”模型，拖入右侧空白处，并从变量栏中“BackLight”模块和文本栏中可以添加文本的图形模块“
”和可以添加数值的“【 】”的模块“
”也拖入右侧空白处，与“设置模型自发光，模型名称： 自发光： 自发光颜色： 强度： ”的模块形成：“设置模型自发光，模型名称：尾灯外圈 自发光：BackLight 自发光颜色：255.102.0 强度：1.6”。
④同理选择“设置模型自发光，模型名称：尾灯外圈 自发光：BackLight 自发光颜色：255.102.0 强度：1.6”合成模块，右键克隆，得到逻辑一样的合成模块，更改模型名称为刹车灯灯珠，自发光颜色为255.0.0，强度为4。形成：“设置模型自发光，模型名称：刹车灯灯珠 自发光：BackLight 自发光颜色：255.0.0 强度：4”合成模块。
⑤同理选择“设置模型自发光，模型名称：刹车灯灯珠 自发光：BackLight 自发光颜色：255.0.0 强度：4”合成模块，右键克隆，得到得到逻辑一样的合成模块，更改模型名称为尾灯左侧灯珠，自发光颜色为255.102.0。形成：“设置模型自发光，模型名称：尾灯左侧灯珠 自发光：BackLight 自发光颜色：255.102.0 强度：4”合成模块。
⑥在变量栏中选择“赋值BackLight为”的模块和“BackLight”模块，拖入右侧空白处。在逻辑栏中选择两个数值可以进行运算的模块“
”拖入右侧空白处与更改文本栏中数值“0”模块为“1”的模块合并成：“1-BackLight值”“
”的合成模块。再将此合成模块并入“赋值BackLight为”的模块中，形成：“赋值BackLight为“1-BackLight值””。
⑦最后将所有合成模块按照逻辑合并在一起，形成：“当左键按下时，点击的物体为：尾灯玻璃 设置模型自发光，模型名称：尾灯外圈 自发光：BackLight 自发光颜色：255.102.0 强度：1.6 设置模型自发光，模型名称：刹车灯灯珠 自发光：BackLight 自发光颜色：255.0.0 强度：4 设置模型自发光，模型名称：尾灯左侧灯珠 自发光：BackLight 自发光颜色：255.102.0 强度：4 赋值BackLight为“1-BackLight值””。
⑧整体思路为：当按下尾灯玻璃时，模型“尾灯外圈”和“刹车灯灯珠”、“尾灯左侧灯珠”开始自发光，此时赋值BackLight为1，模型自发光，然后又赋值BackLight为1-1=0，所以再次按下尾灯玻璃时，尾灯熄灭，此时FrontLight值为0，为隐藏尾灯灯光。
⑧效果完成。
第一次按下尾灯玻璃
第二次按下尾灯玻璃
8.所有流程编辑完成，效果呈现。
9.所有效果完成，点击播放按键，进入播放页面开始交互。
