配置交互

交互动作采用的是触发事件 + 执行动作的模式。可通过单击、双击、长按等事件来显示隐藏组件、打开链接、下发设备数据、唤起气泡、唤起弹窗。

一个组件支持最多有20个交互动作。支持多个交互动作使用同一个触发事件。事件触发时，按照交互动作配置的先后顺序依次执行相应的动作。

一、显示隐藏

触发事件时，控制同页面内其他组件的展示和隐藏。

1. 选择触发事件，选择动作为显示隐藏。

2. 设置点击出现的组件和点击隐藏的组件。均可多选。

应用示例

步骤一：给画布中圆形组件配置交互动作，点击圆形组件时隐藏矩形组件，点击预览查看效果

步骤二：在预览画面点击圆形组件，矩形组件将隐藏。

二、下发数据

触发事件时，设置组件关联设备的属性点和要下发的设置值，设置值可为固定值或者来自某个组件，如来自开关组件的值，也可勾选“启用二次确认”，在下发前或会弹窗提示。配置完成后，可点击“验证”测试是否能成功下发数据。

1. 选择触发事件，选择动作为“下发数据”。

2. 单击“配置下发数据”。

3. 在弹出的对话框中，设置组件关联设备的属性点和要下发的设置值。数据源可以是设备属性点位或者设备属性点类型的变量，设置值可为固定值或者来自某个组件的某个属性，也可勾选“启用二次确认”，在下发前会弹窗提示，点击确定后，提示“下发成功”。

3. 配置完成后，可点击“验证”测试是否能成功下发数据，单击确定。

4. 在浏览时或发布后的页面，通过鼠标事件来触发相应的动作。

下发数据应用示例

示例1: 下发固定值到指定设备点位

第一步： 在页面上增加以下组件，包括工业按钮、文字。

第二步：选中文字组件“加压”为文字组件配置交互动作“下发数据”，设置下发值为固定值10。

第三步：浏览或发布时，可点击文字“加压”，出现下发数据的二次确认弹框，支持修改下发数据，点击确定将压力值10（或修改的下发值）下发到设备。

示例2: 下发组件的值到指定的设备点位

第一步：在页面上增加以下组件，包括工业按钮、文字、数码管。

第二步：选中文字组件“加压”为文字组件配置交互动作“下发数据”，下发的数据值可以来自任意组件的任意属性，目前设置下发值来自数码管的组件值。

第三步：浏览或发布时，可点击文字“加压”将数码管的压力值100下发到设备。

三、打开链接

触发事件时，打开配置的页面链接。

1. 选择触发事件，选择动作为打开链接。

2. 单击选择链接。

3. 在弹出的对话框中，配置链接，单击确定。

应用示例

步骤一：给圆形组件配置交互动作，点击打开链接

步骤二：选择链接并配置，可配置链接打开方式为当前页面或新开页面，可配置目标链接为当前应用页面或指定链接

步骤三：点击预览查看效果，点击对应的组件后将根据配置打开链接。

四、唤起气泡

触发组件事件时，关联的自定义组件以气泡的形式展示出来。

应用示例

步骤一：选中画布中的“点我唤起气泡”组件，配置交互动作“唤起气泡”。

步骤二：点击选中组件配置交互的热区内气泡出现，点击中间画布编辑区，气泡消失。

步骤三：预览时点击“点我唤起气泡”，气泡组件被唤起。

五、唤起弹窗

触发组件事件时，关联的自定义组件以弹窗的形式展示出来。

应用示例

步骤一：选中画布中的矩形组件，配置交互动作“唤起弹窗”。

步骤二：点击选中组件配置交互的热区内弹窗出现，点击中间画布编辑区，弹窗消失。

步骤三：预览时点击“点我唤起弹窗”，弹窗被唤起，点击右上角“x”，关闭弹窗。