Appearance
仅介绍常用组件以及组件部分样式设置以及数据源设置
图表类组件
1.公共配置
图例设置
2.柱状图&&折线图
柱状图与折线图独有设置为 X 轴设置、Y 轴设置、折线(图柱)设置
a. X 轴设置&&Y 轴设置
b.图柱设置
对图柱进行显示上的设置,图柱动态数据来源于 studio 中全局变量
c.折线设置
此部分主要对折线进行显示上的设置,折线动态数据来源于 studio 中全局变量
折线图最多保存 1000 条或两小时内数据,保存数据量可在系统设置中设置
2.饼图
饼图独有设置为饼图配置与饼图数据
a.饼图配置
b.饼图数据
参考折线图/柱状图绑定 studio 参数部分
信息类组件
样式部分就不一一缀叙
1.脚本输出&&文字组件
日志组件仅支持绑定 string 类型组件,其最大保存数据量支持在全局设置中修改
文字组件支持绑定 string、number 类型参数
2.标签选择器组件
标签选择器组件支持绑定当前画布内除标签选择器外所有组件,用来切换绑定组件的显示与隐藏
标签选择器组件仅支持绑定单个组件,若想绑定多个组件,请将组件进行分组,绑定分组
3.基础分页表格
分页表格组件支持绑定 number 类型参数,用来展示 studio 运行数据,其最大保存数据量支持在全局设置中修改,分页表格首列为时间列,默认宽度自适应,支持行列指示、列宽自适应、首列固定等状态参数进行选择
装饰类组件
样式部分就不一一缀叙
此类组件主要为装饰类,包括边框组件、装饰组件、标题组件以及小组件类,用户可自行选择
小组件中数字计数组件、数字翻牌组件、倒计时组件绑定参数类型为 number 类型
小组件中通用天气组件拖入即可展示当前天气,系统默认 key 值存在使用次数限制,建议使用过程中,将 key 值设置为用户申请的高德应用 key
图片类组件
样式部分就不一一缀叙
图像组件支持用户自定义上传图片充当组件
图片属性:
名称 | 说明 |
---|---|
拉伸填充 | 将图片或视频拉伸或压缩,以填充容器,不保持宽高比 |
自适应 | 在保持宽高比的情况下,缩放图片,使其能够完全包含在容器中,容器可能会留出空白区域 |
覆盖 | 在保持宽高比的情况下,缩放图片,使其能够完全覆盖容器,容器可能会有部分内容被裁剪 |
对比自适应 | 在保持宽高比的情况下,缩小图片,使其不超过容器的大小,如果缩小后的大小小于原始大小,则按原始大小显示 |
默认值 | 不对图片或视频进行任何调整,它们会按原始大小显示在容器中 |
套件组件
样式部分就不一一缀叙
运行控制组组件中包括运行状态图标、暂停图标、运行图标、循环运行图标
设备类组件
样式部分就不一一缀叙
设备类组件为 IO 组件,绑定的参数为数组格式参数,数组长度应为 16,每一项应为 1 或 0,1 表示此点红色,0 表示此点白色
统计类组件
样式部分就不一一缀叙
1.竖向产量柱状图&&横向产量柱状图
此组件展示的为历史产量,需要联动数据库进行展示,首先选定数据源表,其次选定展示的参数即可
2.数据折线图
此组件展示的为数据库中每一列的数据,首先选定数据源表,其次为每一列选定数据源(来源于哪一列)
3.单次统计表格
统计表格数据来源需先绑定 studio 中变量,其次根据绑定的变量绑定每一列的数据源,绑定的变量格式为 JSON 字符串,如: [{"PinHeight":7.892,"PinHeightMax":0.5,""PinHeightMin":-0.5","result":"true"}, {"PinHeight":7.892,"PinHeightMax":0.5,""PinHeightMin":-0.5","result":"false"}, {"PinHeight":7.892,"PinHeightMax":0.5,""PinHeightMin":-0.5","result":"false"}]
result 结果列默认绑定
4.配方表格
配方表格用来展示 studio 配方,用户拖进画布后无需进行过多设置即可在预览页正常使用
配方文件修改方式:单击表格数据->修改
图示 | 名称 | 说明 |
---|---|---|
编辑按钮 | 编辑修改配方表格名称 | |
刷新按钮 | studio 修改配方表格后,需刷新 HMI 才会同步显示 | |
新增按钮 | 新增配方文件,用户选择本地配方文件上传 | |
选择按钮 | studio 使用当前配方文件 | |
删除按钮 | 删除当前配方文件 | |
保存按钮 | 修改配方文件后点击保存 |
5.历史查询表格
历史查询表格表格支持查询历史数据,支持重复性查询,运行时首先绑定源表,然后选择查询条件,进行查询
6.事件通知表格
事件通知表格拖入看板即可使用,无需进行数据配置,运行时会自动写入事件,并进行轮播展示(如 studio TCP Server 状态切换等)
7.良率统计组件
良率统计组件用于显示运行后 OK、NG 以及良率显示,支持文字显示以及饼图显示 OK、NG 占比 良率统计组件数据来源于 studio 存储在数据库中数据,需选定源表
8.参数修改框组件
参数修改框组件作用为更改指定参数的值,首先在工程页面选定绑定一个参数,key 值可以手动设置,未设置则显示绑定的参数名,在运行页面可以通过保存看板变量图标或者按钮绑定保存变量事件来更改绑定参数的值
通用类组件组件
1.图标组件
样式部分就不一一缀叙
图标组件目前内置六种图标供用户选择,分为五种运行图标与一种页面图标
运行图标分别为暂停图标、运行图标、循环运行图标、运行状态、保存看板变量 运行图标与 studio 关联,控制着 studio 程序的运行,用户可直接拖入画布中使用,无需过多设置
图示 | 名称 | 说明 |
---|---|---|
暂停图标 | 暂停studio中正在运行的程序 | |
运行图标 | 将整个studio中程序运行一次 | |
循环运行图标 | 循环运行studio程序运行栏的程序 | |
运行状态图标 | 程序运行时为绿色,程序未运行时是红色 | |
保存看板变量图标 |
页面图标为全屏切换图标,页面图标与页面显示状相关,可直接拖入画布中使用
图示 | 名称 | 说明 |
---|---|---|
全屏切换图标 | 运行时切换运行页面全屏/退出全屏显示 |
2.图像组件
样式部分就不一一缀叙
图示 | 名称 | 说明 | 设置图 |
---|---|---|---|
![]() | 1D图像 | ||
2D图像 | |||
3D图像 | 3D 图组件组件,用户可以选择不同 sceneID 展示不同 3D 图,用户可直接拖入画布中使用,无需过多设置 |
3.方形按钮组件
样式部分就不一一缀叙 方形按钮组件含有两种状态,可以设置默认显示状态以及状态切换条件(单击、双击、右键等),每种状态都有自己独有样式以及事件
事件模块包括触发事件、动作、以及目标
名称 | 说明 |
---|---|
触发事件 | 包括单击、双击、右键、鼠标移入、鼠标移出。 |
动作 | 看板跳转、暂停、单步运行、循环运行、保存看板变量、全屏、退出全屏 |
目标 | 动作目标:目前仅有看板跳转动作含有目标选项(跳转至哪一个看板) |