开关

步骤一：添加组件

1. 创建Web应用。具体操作，请参见创建Web应用。

2. 在Web应用编辑器中，单击最左侧的组件图标。

3. 在画布左侧组件列表上方，输入开关，找到该组件，然后将组件拖拽到中间画布。

   有关组件添加的更多信息，请参见添加组件。

   

步骤二：配置数据源

• 配置开关数据源

  1. 在Web应用编辑器右侧样式中，单击开关数据后的配置数据源。

  2. 在数据源配置页面，选择数据源类型，完成配置。

     可选数据类型有设备、接口、静态数据、应用推送。

     说明

     设备数据源支持返回的数据类型为布尔型（bool）和整数型（int）。接口数据源支持返回的数据类型为布尔型（bool）和数值型（单精度数字、双精度数字和整数）。

     • 布尔型：true对应开（On），false对应关（Off）。

     • 整数型：将设备返回的整数型数据转换为布尔型，需设置转换为True和False的整数值。

     • 数值型：使用数据过滤脚本将接口返回的数值型数据转换为布尔型。

  3. 单击确定。

• 可选：配置弹窗数据源

  在Web编辑器右侧样式中，可选中启用二次确认复选框，配置弹窗标题和弹窗文字。您也可通过配置数据源设备、接口、静态数据、应用推送，通过返回的布尔值设置是（True）否（False）启用二次确认。

  说明

  仅手动修改开关状态，会触发二次确认弹窗。

  数据配置	操作
  静态数据	在弹窗标题和弹窗文字右侧提交框中编辑内容。 弹窗标题和弹窗内容将静态展示在对话框中。
  动态数据	单击弹窗标题和弹窗内容提交框右侧的配置数据源按钮，选择数据源类型，完成配置，单击确定。 可选数据源类型有设备、接口、应用推送和页面变量。 弹窗标题和弹窗内容将基于关联的数据源实时更新。 说明 组件支持返回的数据类型为：单精度数字、双精度数字、整数、字符串。 如果弹窗标题和弹窗文字既输入了静态数据，又配置了动态数据，则取动态数据。

步骤三：配置样式

1. 在右侧样式中，完成组件展示的配置。

   配置项	说明
   样式类型	设置组件的样式类型。可选： 开关icon：默认值。即显示效果为组件当前默认样式。 图片：自定义图片对应开关状态。
   ON/OFF状态	为开关的ON和OFF状态设置显示颜色或图片。
   开关响应模式	仅组件数据源为设备时，该配置生效。手动修改开关状态，会下发指令给设备更新对应设备属性值。 您可设置组件开关状态的更新模式： 等待数据返回：等到设备更新并上报属性值成功后，更新组件开关状态。 操作即时响应：手动更新组件状态后，立即更新组件开关状态。 您需设置数据上报延时（ms），如果超出该时间范围设备没有上报更新的数据，组件开关状态会恢复为修改前的状态，开关状态更新失败。

2. 调整组件宽高和在页面中的布局位置。具体操作，请参见样式配置。

步骤四：配置交互动作

1. 在Web编辑器右侧交互中，单击新增交互，设置事件和动作。

   支持值改变事件。例如，组件值改变，执行动作调用设备服务，即指定某设备执行某项特定的任务。

   具体操作，请参见交互配置。

   说明

   若您选中启用二次确认复选框，手动修改开关状态时，需在弹窗中单击确认，您配置的交互动作才会执行。

2. 单击页面右上方的预览，预览和调试组件展示的数据和样式。