数码管组件通过配置发光颜色展示数字。本文介绍组件的详细配置方法。

使用说明

数码管组件支持实时更新的Topic如下表格所示。
名称 Topic 说明
设备属性上报 /${productKey}/${deviceName}/thing/event/property/post 通过该Topic获取设备上报的属性信息。更多信息，请参见设备属性上报。
设备事件上报 /${productKey}/${deviceName}/thing/event/${tsl.event.identifier}/post 通过该Topic获取设备上报的事件信息。更多信息，请参见设备事件上报。
设备属性批量上报 /${productKey}/${deviceName}/thing/property/batch/post 通过该Topic获取设备批量上报的属性信息。更多信息，请参见设备属性批量上报。
设备事件批量上报 /${productKey}/${deviceName}/thing/event/batch/post 通过该Topic获取设备批量上报的事件信息。更多信息，请参见设备事件批量上报。

步骤一：添加组件

  1. 创建Web应用。具体操作，请参见创建Web应用。
  2. 在Web应用编辑器中，单击最左侧的组件图标组件。
  3. 在画布左侧组件列表上方，输入数码管，找到该组件，然后将组件拖拽到中间画布。

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

    数码管组件

步骤二：配置数据源

  1. 在Web应用编辑器右侧样式中，单击数据源后配置数据源。
  2. 在数据源配置页面，选择数据源类型，完成配置。
    可选数据类型有设备、接口、应用推送。
    说明 接口或设备数据源返回的数据类型必须为单精度数字、双精度数字、整数。
    数据源配置
  3. 单击确定。

步骤三：配置样式

  1. 在右侧样式中，完成组件展示的配置。
    配置项 说明
    发光颜色 设置数码管屏幕上数字发光的颜色 ，即发光显示的为当前返回的数据值。
    未发光颜色 设置数码管屏幕上数字未发光的颜色 。
    位数 设置数码管支持显示的数值位数。
    说明 设置的数值位数必须大于等于数据源返回的数值位数，否则会影响组件的正常显示。您可以根据实际场景的需求自定义数值位数。
    屏幕或背景颜色 设置数码管屏幕或背景颜色。
    边框 设置组件是否显示边框，及可显示的样式。
  2. 调整组件在页面中的最终位置。有关组件通用样式配置的更多信息，请参见样式配置。

步骤四：配置交互动作

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

    该组件支持鼠标移入事件。例如，鼠标移入，执行动作展示隐藏，显示某个隐藏的组件，展示组件数据更多的说明信息。

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

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