「画面组态编辑」修訂間的差異

增加 241 位元組 、 2021年8月11日 (三) 19:01
(创建页面,内容为“=== 面板概述 === 无|缩略图 === 组件-盒子 === 画面内的所有组件有层级关系,使用“盒子”来实现封装…”)
 
→‎使用过程中碰到的问题 删除重复内容
 
(未顯示由 2 位使用者於中間所作的 5 次修訂)
第1行: 第1行:
=== 面板概述 ===
== 面板概述 ==
[[File:组态画板介绍.png|无|缩略图]]
[[File:组态画板介绍.png|1100x1100px|无 ]]


=== 组件-盒子 ===
== 组件-盒子 ==
 画面内的所有组件有层级关系,使用“盒子”来实现封装一组元素,可订阅一些变量来实现整个盒子内的子元素显示/隐藏(页面的最顶层也是一个大的“盒子”,所有的子组件其实都是盒子的children)
 画面内的所有组件有层级关系,使用“盒子”来实现封装一组元素,可订阅一些变量来实现整个盒子内的子元素显示/隐藏(页面的最顶层也是一个大的“盒子”,所有的子组件其实都是盒子的children)


第13行: 第13行:
[[File:盒子-事件.png|无|有框]]
[[File:盒子-事件.png|无|有框]]


=== 模板画面 ===
== 模板画面 ==
 目前SCADA项目里所有画面都能够作为模板被其他画面引用。使用场景1:一个全局的Layout模板,给所有画面作为模板使用;使用场景2:自定义一个复杂组件库,如同博图里的Faceplate,只需传入特定参数/变量即可。
 目前SCADA项目里所有画面都能够作为模板被其他画面引用。使用场景1:一个全局的Layout模板,给所有画面作为模板使用;使用场景2:自定义一个复杂组件库,如同博图里的Faceplate,只需传入特定参数/变量即可。


第23行: 第23行:


3.创建此组件的各个元素,所有订阅变量应该都是订阅动态此画面的“屏幕变量”
3.创建此组件的各个元素,所有订阅变量应该都是订阅动态此画面的“屏幕变量”
[[File:盒子-模板.png|无|缩略图]]
[[File:盒子-模板.png|无|缩略图|1100x1100像素]]
[[File:盒子-模板2.png|无|缩略图]]
[[File:盒子-模板2.png|无|缩略图|1100x1100像素]]
 保存完毕后,即可开始使用这个大组件了:
 保存完毕后,即可开始使用这个大组件了:


 在任意画面新建一个组件“盒子”,即可使用,注意填写对应入参对应值或者变量。
 在任意画面新建一个组件“盒子”,即可使用,注意填写对应入参对应值或者变量。
[[File:盒子-模板使用.png|无|缩略图]]
[[File:盒子-模板使用.png|无|缩略图|1100x1100px]]


= 组件概述 =
= 组件概述 =
第35行: 第35行:


* 文字:静态/动态文字展示,可配置颜色大小等,可订阅变量来输出,也可以添加点击事件
* 文字:静态/动态文字展示,可配置颜色大小等,可订阅变量来输出,也可以添加点击事件
* 时间展示:展示当前HMI时间,可配置格式化例如 :YYYY-MM-DD HH:mm:ss.SSS为2021-07-29 18:55:33.730
* 时间展示:展示当前HMI时间,可配置格式化例如 :<code>YYYY-MM-DD HH:mm:ss.SSS</code> 为2021-07-29 18:55:33.730
* 进度条:简单的进度条,根据进度展示进度,可配置颜色、宽度、和表盘类型的进度
* 进度条:简单的进度条,根据进度展示进度,可配置颜色、宽度、和表盘类型的进度
* 菜单:提供了树形可折叠菜单,方便导航、跳转画面
* 菜单:提供了树形可折叠菜单,方便导航、跳转画面
第74行: 第74行:
# 组件选择不到:  建议复杂组件输入好相应的名称,在左侧点击展开方便查找;  深度太浅的组件也没有在大的盒子里,只能从左侧尝试点击item来找到;  有些盒子内的组件占满了盒子,这时候只能通过点击盒子内的组件,然后到左侧点击选中的父级item(可能要点两次)
# 组件选择不到:  建议复杂组件输入好相应的名称,在左侧点击展开方便查找;  深度太浅的组件也没有在大的盒子里,只能从左侧尝试点击item来找到;  有些盒子内的组件占满了盒子,这时候只能通过点击盒子内的组件,然后到左侧点击选中的父级item(可能要点两次)
# 一个组件的数据订阅:多个订阅之间互不影响,都是独立执行的,也可以多个订阅同时订阅一个变量。
# 一个组件的数据订阅:多个订阅之间互不影响,都是独立执行的,也可以多个订阅同时订阅一个变量。
# 数据订阅逻辑:  首先由一个变量出发(目前是三种类型 ,PLC 变量是通过PLC读过来的 ,LOC 变量是内部变量没有地址 ,SCR 变量是画面级别的内部Props,只能在被当做template调用时赋值)  多个触发器之间是顺序判断相当于 if (触发器1){ then  设置属性A; 设置属性B} else if (触发器2) { then  设置属性C; } else if (触发器3){ then ... } else{ ....}   最后一条如果没有写条件的相当于走到了else
# 数据订阅逻辑:  首先由一个变量出发(目前是三种类型 ,<code>PLC</code> 变量是通过PLC读过来的 ,<code>LOC</code> 变量是内部变量没有地址 ,<code>SCR</code> 变量是画面级别的内部Props,只能在被当做template调用时赋值)  多个触发器之间是顺序判断相当于<syntaxhighlight lang="javascript">
# Bool值的一些问题:在SCADA中bool类型的触发条件和设定变量值时 是true和false ,而对于Word取位的判断则需要用1和0判断(后续可能要优化)
if (触发器1) {
  设置属性A;
  设置属性B
} else if (触发器2) {
  设置属性C; 
} else if (触发器3) {
  ...
} else { 
  ...
}
</syntaxhighlight> 最后一条如果没有写条件的相当于走到了else 分支
# Bool值的一些问题:在SCADA中bool类型的触发条件和设定变量值时 是<code>true</code>和<code>false</code> ,而对于Word取位的判断则需要用1和0判断(后续可能要优化)
# 数据订阅的一个触发条件可以同时设置多个属性,例如可以同时设置颜色和背景色;事件也可以设置“回调”多个变量值(不过更推荐“同时设置多个变量值”的功能)
# 数据订阅的一个触发条件可以同时设置多个属性,例如可以同时设置颜色和背景色;事件也可以设置“回调”多个变量值(不过更推荐“同时设置多个变量值”的功能)
# 取反功能:在回调里设置类型“将变量在固定值中切换”,然后添加两个值,分别 是true和false
# 取反功能:在回调里设置类型“将变量在固定值中切换”,然后添加两个值,分别 是<code>true</code>和<code>false</code>
# 可见性设置:如果需要配置一块元素的可见性,订阅一 个bool 的变量 ,true 时可见 ,false 不可见,则可以只需要设置一个触发器“触发条件选空,设置属性’显示‘->’为变量值'"(推荐这么设置,当然设置两个条件去做也是没问题的)
# 可见性设置:如果需要配置一块元素的可见性,订阅一 个<code>bool</code> 的变量 ,<code>true</code> 时可见 ,<code>false</code> 不可见,则可以只需要设置一个触发器“触发条件选空,设置属性’显示‘->’为变量值'"(推荐这么设置,当然设置两个条件去做也是没问题的)