Tiny流程编辑器

流程编辑器是Tiny框架提供了编辑流程的图形化工具。目前支持的流程有逻辑流程和页面流程，未来也许会扩展其他的流程。

流程编辑器简介

后缀是*.flow或者*.pageflow的流程文件可以直接在Eclipse里面双击，调用相关编辑器打开；新建流程则按“New”-“Other”-“Tiny框架”的顺序，从向导界面选择适当的流程。

• 逻辑流程。处理具体业务组件的流程，包含的组件是逻辑组件(*.fc.xml)，生成的逻辑流程文件(*.flow)。
• 页面流程。处理控制层的流程，包含的组件是页面组件(*.pagefc.xml)，生成的页面流程文件(*.pageflow)。页面流程可以以子流程的形式调用逻辑流程。
  

向导界面如下图：

QQ%E6%88%AA%E5%9B%BE20141215103247.jpg (36.95 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

基础组件资源

目前Tiny框架提供如下几种组件库，用户可以根据实际需要配合流程编辑器使用。使用方法很简单，在pom.xml加入相关组件依赖，刷新依赖后，在流程编辑器的控制面板就能看到相关组件。

• org.tinygroup.flowbasiccomponent 提供了逻辑基本组件，如对象转换组件、调用静态方法和bean组件等。
• org.tinygroup.flowservicecomponent 提供了逻辑基本服务，如调用服务、调用本地流程、调用页面流程等。
• org.tinygroup.tinydbflowcomponent 提供了TinyDB数据库组件，如插入组件、更新组件、删除组件、查询记录组件等。
• org.tinygroup.pageflowbasiccomponent 提供了页面基本组件，如页面重定向、页面转发等。
  

编写页面流程

接下来我们就讲解如何通过工具快速编写页面流程。

第一步，选择工程，按“New”-“Other”的顺序，打开图形化工具界面，选择“页面流程”，见下图：

QQ%E6%88%AA%E5%9B%BE20141215111636.jpg (40.7 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

点击“next”,输入要定义的页面流程名称，比如输入aaa，那么最后保存的配置文件就是aaa.pageflow，图形工具初始化界面如下图：

QQ%E6%88%AA%E5%9B%BE20141215111836.jpg (38.26 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

QQ%E6%88%AA%E5%9B%BE20141215111950.jpg (23.54 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

面板简介

• 面板中央是“流程编排”的画板，对流程、流程节点、节点关系的增加、删除、编辑全部在这里完成。默认有“开始”和“结束”两个节点。
• 面板右侧上方是控件栏：最上方是查询框，在组件很多时，比较有用； 下面三个按钮依次是选择模式、正常分支、异常分支，正常分支就是给节点间添加一条表示正常流转的黑色单箭头，异常分支是给节点间添加一条表示异常时才流转的红色单箭头。
• 面板右侧下方是组件列表。Tiny框架支持XML配置和类注释两种方式读取组件信息，页面流程加载的页面组件对应的配置名称是*.pagefc.xml,在项目开发中，组件设计者把设计好组件类及相关配置打包，流程开发者只要在工程引入这些jar包，就可以在图形化工具自动找到相关组件。
  

示例流程图：

QQ%E6%88%AA%E5%9B%BE20141215151144.jpg (23.85 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

面板下方是Properties，用户可以在这里查看、编辑流程、组件、流转的属性，如下图：

QQ%E6%88%AA%E5%9B%BE20141215145854.jpg (21.78 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

QQ%E6%88%AA%E5%9B%BE20141215150049.jpg (22.09 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

QQ%E6%88%AA%E5%9B%BE20141215151014.jpg (17.93 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

属性页说明

• 流程属性页。包含扩展属性、基本信息、流程参数三个Tab页，点击画板空白处，即可打开。
• 组件属性页。包含扩展属性、基本信息两个Tab页，点击组件节点，即可打开。
• 流转属性页。包含扩展属性、基本信息两个Tab页，点击红色或者黑色单箭头，即可打开。
  

添加节点

• 鼠标选中某个组件，然后拖曳到画板上，放开鼠标，自动就添加一个包含刚才选择组件的节点。
• 因为新增节点的上下游节点是由框架决定的，如果不符合要求，可以删除旧的关联，添加新的关联。
  

增加组件的效果，如图：

QQ%E6%88%AA%E5%9B%BE20141215151446.jpg (20.3 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

QQ%E6%88%AA%E5%9B%BE20141215151530.jpg (21.05 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

Tiny框架会自动计算组件位置，不仅便利而且非常美观。另外一定有用户问，如何将组件拖到自己想要的位置？很简单，将要添加的组件往目标组件的下方放就可以了。

譬如，本人拖曳一个“sql查询组件”在“开始”节点和“插入组件”中间，那么流程编辑器会自动生成如下效果图：

QQ%E6%88%AA%E5%9B%BE20141215152230.jpg (17.46 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

譬如，将“sql查询组件”拖到“插入组件”右边，那么流程编辑器会生成如下关系：

QQ%E6%88%AA%E5%9B%BE20141215152507.jpg (21.68 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

譬如，将“sql查询组件”拖到“插入组件”下面，那么流程编辑器会生成如下关系：

QQ%E6%88%AA%E5%9B%BE20141215152620.jpg (21.98 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

删除节点

• 第一种删除办法，选中要删除的节点，按Eclipse工具栏上的删除按钮。
• 第二种删除办法，选中要删除的节点，按键盘的Del按钮也可以删除。
  

编写逻辑流程

第一步，选择工程，按“New”-“Other”的顺序，打开图形化工具界面，选择“逻辑流程”，见下图：

QQ%E6%88%AA%E5%9B%BE20141215110422.jpg (40.78 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

点击“next”,输入要定义的逻辑流程名称，比如输入bbb，那么最后保存的配置文件就是bbb.flow，图形工具初始化界面如下图：

QQ%E6%88%AA%E5%9B%BE20141215110551.jpg (37.57 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传

最后点击“Finish”就完成了创建工作，结果如图：

QQ%E6%88%AA%E5%9B%BE20141215110801.jpg (18.83 KB, 下载次数: 0)

下载附件

2015-5-27 13:41 上传