GEF（Graphical Editor Framework) Eclipse项目入门系列（3）---Draw2D例子演示

在”GEF（Graphical Editor Framework) Eclipse项目入门系列（2）---Draw2D开发环境的搭建“一文中，我给大家介绍了Draw2D的开发环境的搭建。下一步，根据软件行业的惯例，需要展示一个例子，这样大家才更有兴趣去学习和探索这门技术。好了，废话少说，作者就借花献佛，用Dan Rubel，Jaimen Wren和Eric Clayberg的一个例子Draw2D的例子和大家分享一下。这个例子包括两个类，GenealogyView和FigureMover。 其中GenealogyView是一个绘制一家三口的关系的程序，FigureMover是一个鼠标事件监听程序，通过这个程序，用户可以拖拽一家三口的位置。程序跑起来后的效果如下。

注意，跑起来后，上面的三个正方形的位置可以通过鼠标拖拽，任意改变。

具体程序代码如下：

(1) GenealogyView 类： 主程序入口

import org.eclipse.draw2d.*;
import org.eclipse.draw2d.geometry.*;
import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.GridData;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Canvas;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;

public class GenealogyView {

	private Connection connect(IFigure figure1, IFigure figure2) {
		PolylineConnection connection = new PolylineConnection();
		connection.setSourceAnchor(new ChopboxAnchor(figure1));
		connection.setTargetAnchor(new ChopboxAnchor(figure2));
		return connection;
	}

	private IFigure createMarriageFigure() {
		Rectangle r = new Rectangle(0, 0, 50, 50);
		PolygonShape polygonShape = new PolygonShape();
		/**
		 * Top:25,0
           Left:0,25
           Bottom:25,50
           Right:50,25
		 */
		System.out.println("Top:"+r.getTop().x+","+r.getTop().y);
		System.out.println("Left:"+r.getLeft().x+","+r.getLeft().y);
		System.out.println("Bottom:"+r.getBottom().x+","+r.getBottom().y);
		System.out.println("Right:"+r.getRight().x+","+r.getRight().y);
		polygonShape.setStart(r.getTop());
		polygonShape.addPoint(r.getTop());
		polygonShape.addPoint(r.getLeft());
		polygonShape.addPoint(r.getBottom());
		polygonShape.addPoint(r.getRight());
		polygonShape.addPoint(r.getTop());
		polygonShape.setEnd(r.getTop());
		polygonShape.setFill(true);
		polygonShape.setBackgroundColor(ColorConstants.lightGray);
		polygonShape.setPreferredSize(r.getSize());
		new FigureMover(polygonShape);
		return polygonShape;
	}

	private IFigure createPersonFigure(String name) {
		RectangleFigure rectangleFigure = new RectangleFigure();
		rectangleFigure.setBackgroundColor(ColorConstants.lightGray);
		rectangleFigure.setLayoutManager(new ToolbarLayout());
		rectangleFigure.setPreferredSize(100, 100);
		rectangleFigure.add(new Label(name));
		new FigureMover(rectangleFigure);
		return rectangleFigure;
	}

	private Canvas createDiagram(Composite parent) {
		// Create a root figure and simple layout to contain
		// all other figures
		Figure root = new Figure();
		root.setFont(parent.getFont());
		XYLayout layout = new XYLayout();
		root.setLayoutManager(layout);

		// Add the father Andy
		IFigure andy = createPersonFigure("Andy");
		root.add(andy);
		layout.setConstraint(andy,new Rectangle(new Point(10, 10), andy.getPreferredSize()));

		// Add the mother "Betty"
		IFigure betty = createPersonFigure("Betty");
		root.add(betty);
		layout.setConstraint(betty,new Rectangle(new Point(230, 10), betty.getPreferredSize()));

		// Add the son "Carl"
		IFigure carl = createPersonFigure("Carl");
		root.add(carl);
		layout.setConstraint(carl,new Rectangle(new Point(120, 120), carl.getPreferredSize()));

		//Added marriage relationship
		IFigure marriage = createMarriageFigure();
		root.add(marriage,new Rectangle(new Point(145, 35),marriage.getPreferredSize()));

		//Connect persons as marriage relationship
		root.add(connect(andy, marriage));
		root.add(connect(betty, marriage));
		root.add(connect(carl, marriage));

		// Create a canvas to display the root figure
		Canvas canvas = new Canvas(parent, SWT.DOUBLE_BUFFERED);
		canvas.setBackground(ColorConstants.cyan);
		LightweightSystem lws = new LightweightSystem(canvas);
		lws.setContents(root);
		return canvas;
	}

	private void run() {
		Shell shell = new Shell(new Display());
		shell.setSize(365, 280);
		shell.setText("Genealogy");
		shell.setLayout(new GridLayout());
		Canvas canvas = createDiagram(shell);
		canvas.setLayoutData(new GridData(GridData.FILL_BOTH));
		Display display = shell.getDisplay();
		shell.open();
		while (!shell.isDisposed()) {
			while (!display.readAndDispatch()) {
				display.sleep();
			}
		}
	}

	public static void main(String[] args) {
		new GenealogyView().run();
	}
}

(2) FigureMover类： 鼠标拖拽程序监听

import org.eclipse.draw2d.*;
import org.eclipse.draw2d.geometry.*;

/**
 * A Draw2D mouse listener for dragging figures around the diagram. Listeners such as this
 * are useful for manipulating Draw2D diagrams, but are superseded by higher level GEF
 * functionality if the GEF framework is used.
 */
public class FigureMover
	implements MouseListener, MouseMotionListener
{
	private final IFigure figure;
	private Point location;

	/**
	 * Construct a new instance for dragging the specified figure around the diagram.
	 *
	 * @param figure the figure to be dragged.
	 */
	public FigureMover(IFigure figure) {
		this.figure = figure;
		figure.addMouseListener(this);
		figure.addMouseMotionListener(this);
	}

	/**
	 * Cache the mouse down location and mark the event as consumed so that the Draw2D
	 * event dispatcher will send all mouse events to the figure associated with this
	 * listener until the mouse button is released.
	 */
	public void mousePressed(MouseEvent event) {
		location = event.getLocation();
		event.consume();
	}

	/**
	 * Process mouse drag events by moving the associated figure and updating the
	 * appropriate figure in the diagram.
	 */
	public void mouseDragged(MouseEvent event) {
		if (location == null)
			return;
		Point newLocation = event.getLocation();
		if (newLocation == null)
			return;
		Dimension offset = newLocation.getDifference(location);
		if (offset.width == 0 && offset.height == 0)
			return;
		location = newLocation;

		UpdateManager updateMgr = figure.getUpdateManager();
		LayoutManager layoutMgr = figure.getParent().getLayoutManager();

		Rectangle bounds = figure.getBounds();
		updateMgr.addDirtyRegion(figure.getParent(), bounds);
		// Copy the rectangle using getCopy() to prevent undesired side-effects
		bounds = bounds.getCopy().translate(offset.width, offset.height);
		layoutMgr.setConstraint(figure, bounds);
		figure.translate(offset.width, offset.height);
		updateMgr.addDirtyRegion(figure.getParent(), bounds);
		event.consume();
	}

	/**
	 * Clear the last cached mouse location signaling the end of the drag figure
	 * operation.
	 */
	public void mouseReleased(MouseEvent event) {
		if (location == null)
			return;
		location = null;
		event.consume();
	}

	public void mouseMoved(MouseEvent event) {
	}

	public void mouseDoubleClicked(MouseEvent event) {
	}

	public void mouseEntered(MouseEvent event) {
	}

	public void mouseExited(MouseEvent event) {
	}

	public void mouseHover(MouseEvent event) {
	}
}

在一下章节，笔者将会给大家一起过一遍这个演示程序的代码。敬请关注和期待。。。。。。。