[置顶] 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) {
}
}

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