跳到主要内容

介绍

1. 简介

组态编辑器,是绘制组态页面的在线制作工具。优选物联的组态编辑器,最大的特点是可以极速与数据点位绑定,使页面制作简单高效,而且是无需编码,小白用户也可以容易上手。

除了普通的图形、文本、图片,编辑器还内置了粗粒度的点位高级组件,比如点位树、点位表、设备、开关、状态、图像,表格,图表等,使用简单便捷。

编辑器内置了多种动效,只需选择匹配对应的组件即可,无需代码实现。

组态页面处理实时数据,满足监控的要求,同时也可以嵌入历史数据报表,是应用更加丰富有力。

2. 布局介绍

2.1 顶部工具条

头部工具条,主要是针对页面的通用操作提供便利。工具条主要提供以下功能:

  • 缩放工具
    页面的放大缩小,用于适配视觉效果

  • 图层向前/向后
    图层层叠时,较前的图层会覆盖较后的图层,使用图层的向前/向后工具,可以调整组件的图层层叠关系。

  • 撤销/重做
    编辑中操作失误时的可以采取的一种处理方法,恢复到上一步的状态。

  • 跨页复制/粘贴
    方便已完成的组件在另一个页面进行应用。

    提示

    注意,跨页复制到另外一页时,需要先进行保存操作,然后刷新,再进行下一步的编辑。

  • 保存文件
    可以保存到云端,下次在平台中直接打开。
    也可以保存到本地,下次可以用「打开」文件的方法导入到编辑器。

  • 打开文件
    打开保存在本地的组态文件

  • 快捷菜单
    打开点位树列表,从点位树可以直接拖动点位到画布,并自动完成绑点。
    打开点位表列表,从点位表列表可以直接拖动点位表到画布,并自动完成绑点。
    打开设备列表,从设备列表可以直接拖动设备到画布,并自动完成绑点。

  • 页面预览
    将页面从编辑状态切换至带数据预览状态,确认组态页面的运行效果。

2.2 左侧资源栏

左侧的资源栏,是存放元件资源的栏目。如果需要应用到更多元件,先将资源从「系统更多元件」菜单中调取出来,然后再使用。

2.2.1 调取更多资源

点击「系统更多元件」:

然后在弹出框选择需要调取的资源(可多选), 点击「确定」:

提示

点击勾选框右边的名称,可以预览元件资源。但只有勾选中的元件,才会被调取到资源栏中。

然后可以看到资源栏中多了刚才所选择调取的元件资源:

2.2.2 使用元件资源

当资源被调取到资源栏后,可以对元件的资源组展开,可以将所需的元件拖动到中心编辑画布中:

2.3 右侧属性栏

右侧属性栏,是对应的元件的属性设置区域。如果没有选中任何元件,则显示本页面的设置区域。

拖出一个图片元件后(并且在画布中选择该图片),可以看到改图片元件对应的属性设置,可以换图,或者转为设备、开关或者其他等。

2.4 中心编辑画布

画布是组态编辑页面的元件集合的容器,画布呈现了组态的框架和大致内容,只是未注入对应点位的数据。编辑完成后,可以点击顶部工具条的「预览」来预览页面的运行效果。

3. 元件分类

4. 特色功能

4.1 快捷菜单

绑点的功能会依赖快捷菜单的使用,特别是点位树。 可以在 快捷菜单 了解更多。

4.2 拖拽绑点

拖出一个元件画布上,打开点位树,点位树的点位拖在元件上,就可以把点位与元件进行绑定。

4.3 自动绑点

  • 点位树
    点位树的叶子节点,直接拖拽到画布上,文本元件与点位自动绑定。
    点位树的树枝,直接拖拽到画布上,拖出的点位树自动与对应的点位绑定。
  • 点位表
    点位表直接拖拽到画布上,拖出的点位表自动与对应的点位绑定。
  • 设备
    标准的设备,直接拖拽到画布上,拖出的设备自动与对应的点位绑定。

4.4 高级组件

  • 点位树
    大粒度的数据点位,可以快速展现点位数据。
  • 点位表
    群控的设备表,方便快速控制设备。
  • 设备
    标准和形象的设备,一体化信息展示。
  • 开关
    快捷切换设备的开与关。
  • 状态
    便捷展示设备相关的数据状态。
  • 导航菜单
    一次设置,多次应用,形成页面之间的系统关联。
  • 页框
    方便引入页面组态之外的内容,丰富和扩展组态页面。

4.5 内置动效

系统内置了变色、换图、水流等动效效果,可以根据点位数据变化而变化。

4.6 内置操作

系统内置了链接跳转、对象控制、点位操作、菜单导航等操作,方便交互。