jBPMWebDesigner工作流程设计器使用笔记
版权申诉
173 浏览量
2023-09-22
08:22:51
上传
评论
收藏 845KB DOCX 举报
jBPM Web Designer（jBPM Web 设计器、jBPM 流程
设计器、工作流程设计器）
研究 jBPM 已有一段时间了，今天终于决定拿点东西出来，但请大家原谅不能分享源码。
之所以拿出来，希望通过交流认识到更多技术一线的同志们，结点人缘。本人不才只念完了
高中，求职路屡战屡败，只好踏实地弄点东西出来撑下门面，希望有所帮助，找到一份满意
的工作。
大多研究 JBPM 的，对其引擎的扩展开发都不曾苦恼，但提及其可视化设计工具都希
望能有一款 WEB 版设计器。
苦恼过后，便有了开发设计器的冲动。首先通过网上找到的 WEB 流程设计工具，多半
是非流程研究人员的产品，拿来用要经过大量的修改，不太可取，也不容易修改，参考倒是
有些价值，在此谢过；另外由于刚学会了 JavaScript 在页面实现的拖曳功能。鉴于此便开始
了行动，现在想想还有些大胆。由于一直没抽出时间来，拖了两个多月，终于写下了这篇文
章。
基于 javaScript+css+vml 的 jBPMwebdesigner，由于使用了 vml 只支持 IE 浏览器
（IE5+），其中没有使用任何 javaScript 开发框架，但模仿了 extJs 框架的 css 界面风格。
开发过程中参考了 extJs、prototype、jQuery 等 javaScript 开发框架；参考了 jBPM designer
eclipse 插件；参考了 shine Workflow Designer 截图、以及圈子中 shappy1978 贴出来的截
图（当时还回帖希望这位大哥分享源码，结果失望，也就狠下心来独干，造自己的轮子）；
还参考了 webflow、XiorkFlow、EMSFlow（applet）等，XiorkFlow 是早期看过的流程设计
工具。在此谢过以上提供的参考。
以下以贴图方式介绍 jBPM3 webdesigner。
1、流程设计器主界面，采用纯 JS 且面向对象的编程方式（事件处理机制 swing、extjs
思想中毒很深）开发，动态生成 div 等 HTML 代码，利用外部样式表以实现多风格支持，根
据窗口大小自适应宽高，以使编辑区域最大可视化，仿 jBPM designer eclipse 插件布局与
操作习惯（其中个人觉得属性输入要比 eclipse 插件方便些），仿 extJs 框架的 css 界面风
格。主界面分为三部分，工具栏、编辑区、属性栏，支持鼠标拖动设定大小及最大化、最小
化、还原功能。编辑区支持网格显示。目前设计器支持开始、结束、分支、合并、决策、任
务、邮件 7 种节点（可以容易扩展新节点）并可以通过鼠标拖曳操作编辑大小，流程转换可
以通过鼠标操作支持直线及折线。节点的连接操作进行验证，如只允许拖入一个开始节点；
开始节点只允许单个 from 连接；结束节点只允许 to 连接，但支持多个连接；两个节点只能
有唯一的同向连接等等。点击编辑区的空白处在属性栏显示流程定义的属性配置，点击节点
剩余11页未读，继续阅读
资源评论
