上一篇介绍了定制器相关的文件,这篇我们来看看整个定制器的界面部分,了解了页面结构有助于更好的理解定制器的实现,那么现在开始吧!

首先,我们来看看整体的结构:

整体结构比较简单,主要包括三个部分:

1.调色板:放置工作流各种模型(节点、分支、开始、结束等等),使用时用鼠标拖动放到画布上即可,比                    较简单不再赘述;

2.画布:绘制工作流区域,这里是定制器的主要工作区,它有两个Tab页:Diagram和XML;其中Diagram可                 以展现工作流的流程图,XML用来展现工作流生成的XML文件;这两个功能后面会着重的介绍。

3.属性设置:定义和现实流程中所有模型对应的属性区域,不同的模型显示会不同。

以上是整体结构的介绍,这个看起来比较简单与Activiti提供的Eclipse的插件界面类似,其实也是借鉴了它的界面,这样比较容易不用再设计。

下面详细讲解一下每一个部分:

第一部分、调色板区域:

调色版区域包括:Event、Task、Gateway、Boundary event四个文件夹,每个文件夹与Activiti官方的模型分类一一对应,具体意义可以参照官方文档,本文主要是讲解定制器所以有关Activiti的内容这里不再赘述,有兴趣可以看看官方文档,很好很全面也很好理解。

Event文件夹如图:


 Event文件夹放置工作流的开始和结束节点。

Task文件夹如图:


 Task文件夹放置工作流中各种类型的任务节点,每种类型节点意义请参照官方文档,其中SubProcess(子流程)目前版本没有实现。

Gataway文件夹如图:


Gateway文件夹放置分支节点,包括:ParallelGateway(并行分支)和ExclusiveGateway(选择分支),具体意义请参照官方文档

Boundary event文件下的节点目前还未实现,所以这里先略过。

第二部分、画布

画布区域比较简单,只有两个Tab页:

Diagram页面如图:

 Diagram页面主要用来绘制工作流程图。

XML页面如图:


XML页面可以显示流程图产生的XML,可以将这个XML字符串提交到服务端进行流程部署。

基于easyui开发Web版Activiti流程定制器详解(三)——页面结构(上)的更多相关文章

  1. 【转】基于easyui开发Web版Activiti流程定制器详解(一)——目录结构

    题外话(可略过): 前一段时间(要是没记错的话应该是3个月以前)发布了一个更新版本,很多人说没有文档看着比较困难,所以打算拿点时间出来详细给大家讲解一下,由于本人平时要工作还要陪老婆和孩子而且还经营着 ...

  2. 基于easyui开发Web版Activiti流程定制器详解(五)——Draw2d详解(一)

    背景: 小弟工作已有十年有余,期间接触了不少工作流产品,个人比较喜欢的还是JBPM,因为出自名门Jboss所以备受推崇,但是现在JBPM版本已经与自己当年使用的版本(3.X)大相径庭,想升级也不太容易 ...

  3. 基于easyui开发Web版Activiti流程定制器详解(六)——Draw2d的扩展(三)

    题外话: 最近在忙公司的云项目空闲时间不是很多,所以很久没来更新,今天补上一篇! 回顾: 前几篇介绍了一下设计器的界面和Draw2d基础知识,这篇讲解一下本设计器如何扩展Draw2d. 进入主题: 先 ...

  4. 基于easyui开发Web版Activiti流程定制器详解(四)——页面结构(下)

    题外话: 这两天周末在家陪老婆和儿子没上来更新请大家见谅!上一篇介绍了调色板和画布区的页面结构,这篇讲解一下属性区的结构也是定制器最重要的一个页面. 属性区整体页面结构如图:  在这个区域可以定义工作 ...

  5. 基于easyui开发Web版Activiti流程定制器详解(六)——Draw2d详解(二)

    回顾: 上一篇我们介绍了Draw2d整体结构,展示了组件类关系图,其中比较重要的类有Node.Canvas.Command.Port.Connection等,这篇将进一步介绍Draw2d如何使用以及如 ...

  6. 基于easyui开发Web版Activiti流程定制器详解(二)——文件列表

    上一篇我们介绍了目录结构,这篇给大家整理一个文件列表以及详细说明,方便大家查找文件. 由于设计器文件主要保存在wf/designer和js/designer目录下,所以主要针对这两个目录进行详细说明. ...

  7. SAE上传web应用(包括使用数据库)教程详解及问题解惑

    转自:http://blog.csdn.net/baiyuliang2013/article/details/24725995 SAE上传web应用(包括使用数据库)教程详解及问题解惑: 最近由于工作 ...

  8. Java web 入门知识 及HTTP协议详解

     Java  web  入门知识 及HTTP协议详解 WEB入门 WEB,在英语中web即表示网页的意思,它用于表示Internet主机上供外界访问的资源. Internet上供外界访问的Web资 ...

  9. 转:JAVAWEB开发之权限管理(二)——shiro入门详解以及使用方法、shiro认证与shiro授权

    原文地址:JAVAWEB开发之权限管理(二)——shiro入门详解以及使用方法.shiro认证与shiro授权 以下是部分内容,具体见原文. shiro介绍 什么是shiro shiro是Apache ...

随机推荐

  1. C#,一些非常简单但应该知道的知识点

    1.本地变量 一看这个标题你可能会一愣,这是个什么东东.看个小例子: static void main(){   int a=10;   MyClass mc=new MyClass();} 呵呵,这 ...

  2. 三:Jquery-event

    一:jq中事件 1.页面载入事件 ready()方法 格式: $(document).ready(function(){}); $(function(){}); 2.绑定事件 click(),dblc ...

  3. 无法解决 equal to 运算中 "Chinese_PRC_CI_AS" 和 "Latin1_General_100_CI_AS" 之间的排序规则冲突。

    问题 操作临时表时提示如下排序规则冲突错误 sql ....忽略...sql ..... 无法解决 equal to 运算中 "Chinese_PRC_CI_AS" 和 " ...

  4. BIO、NIO和AIO的区别

    一:事件分离器 在IO读写时,把 IO请求 与 读写操作 分离调配进行,需要用到事件分离器.根据处理机制的不同,事件分离器又分为:同步的Reactor和异步的Proactor. Reactor模型: ...

  5. ssm项目快速搭建(配置)

    核心jar包 <properties>    <project.build.sourceEncoding>UTF-8</project.build.sourceEncod ...

  6. zookeeper 选举

    选举概述: 1.启动时期的选举 所有的服务器状态为 LOOKING. 1.1.每个Server 会投出一票(投票规则为:SID.ZXID ,即 服务器ID 和 最大事务ID). 1.2.处理选票 (A ...

  7. PoPo数据可视化周刊第6期

    PoPo数据可视化 聚焦于Web数据可视化与可视化交互领域,发现可视化领域有意思的内容.不想错过可视化领域的精彩内容, 就快快关注我们吧 :) 本期可视化精彩视频请关注公众号浏览 全天智能获Pre-A ...

  8. c#如何仅在datatgirdview控件的头部(列名处)添加右键菜单

    近期在弄ArcgisAE实习,其中有一个功能是需要操作图层的属性字段的,为了方便操作图层的属性,最好是在图层的属性表中,也就是在显示图层属性的DataGirdView控件的头部添加一个右键菜单来实现相 ...

  9. [清华集训]Rmq Problem / mex

    题目链接 我们离线处理这些询问 在右端点所在的位置用vector来push_back询问 维护每个数值最后出现的位置p[x] 从左往右扫,边走边回答询问 对于每个询问我们回答第一个p[x]<l的 ...

  10. 本地快速搭建 FTP 服务器

    一.什么是FTP FTP(File Transfer Protocol)是TCP/IP网络上两台计算机传送文件的协议,使得主机间可以共享文件. 二.搭建前期准备 1.首先打开控制面板找到“程序”点击打 ...