使用Flex开发Activiti流程设计器（二 绘制图元）

页面的图形元素有很多的共同点并且有很大的相似性，如都需要拖动， 都需要序列化，等等，所以就抽象出一个父类Node。

?

所有的图元对象都继承Node，Node继承自UIComponent改类主要提供一些共用的方法，如点击拖动、得到组件中点、所有到组件的连线集合等属性或方法。

?

? ? ? ? 对于不同的图元有不用的形状，通过重写UIComponent的updateDisplayList来实现不同形状的绘图。updateDisplayList方法会在组件的状态更改时调用。

（由于是公司项目所以代码只能粘一部分了??）

?

package com.iyspace.bpmn.utils{import com.iyspace.bpmn.view.StyleUtils;import flash.display.GradientType;import flash.display.Graphics;import flash.display.Sprite;import flash.geom.Matrix;public class StartEvent extends Node{private var view:Sprite = new Sprite();public function StartEvent(){super();this.addChild(view);trace("start"+this.width);}override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{super.updateDisplayList(unscaledWidth,unscaledHeight);var w:Number = this.width;var h:Number = this.height;var g:Graphics = view.graphics;var matrix:Matrix = new Matrix();g.clear();matrix.createGradientBox(50,50,Math.PI / 2,0,h/2-10);g.lineStyle(StyleUtils.BORDER_THICK,StyleUtils.BORDER_COLOR,StyleUtils.BORDER_ALPHA);g.beginGradientFill(GradientType.LINEAR, [StyleUtils.START_COLOR, StyleUtils.END_COLOR], [1, 1], [0, 200], matrix);g.drawCircle(w/2,h/2,h/2);g.endFill();}}}

?开始节点主要画了一个渐变的圆形。

?

?更多的flex绘图可以去研究一下api

?

?

?

?