滑条组件可用于展示和控制设备的某个数值型属性,支持配置样式交互动作,可绑定设备和接口数据源使用。本文介绍滑条组件的配置和使用方法。

前提条件

参考以下操作完成Web应用创建。
  1. 创建项目
  2. 创建Web应用

操作步骤

本文主要介绍组件样式的个性配置。有关组件样式的通用配置,请参见样式配置

  1. 在Web可视化编辑页面,单击最左侧的组件图标组件
  2. 在画布左侧组件下拉列表,选择基础组件,并展开基础列表。
  3. 拖拽一个滑条组件到画布中,单击右侧样式展示数据对应配置数据源
    滑条组件
  4. 在展开的数据源配置面板,完成数据源配置,并单击确定
    有关数据源的详细配置操作,请参见设备接口
    说明 数据源返回的数据类型必须为单精度数字、双精度数字、整数。
  5. 根据以下配置项说明(见下表)完成组件展示样式的配置。
    配置项 说明
    数值范围 设置滑条展示数据的最大、最小值和步长(刻度间隔值)。
    两端标签 即最小值端点和最大值端点。支持设置字号、颜色和字体粗细。

    选中是否隐藏复选框,则表示隐藏两端标签。

    当前值 选中是否常驻显示复选框,则表示滑条上常驻显示当前值。支持设置字号、颜色和字体粗细。
    滑条样式 设置滑条的外观:滑条圆点直径、滑条底色和滑条上进度显示颜色。
  6. 可选: 在Web可视化编辑页面,选中目标组件的交互页签,配置事件和交互动作。详细配置指导请参见交互配置
  7. 单击页面右上方的预览,查看或调试组件的展示数据。