GEF (Graphical Editor Framework) Eclipse project entry series (3) --- Draw2D demo, gef --- draw2d
In the article "GEF (Graphical Editor Framework) Eclipse project getting started series (2) --- setting up the Draw2D development environment", I will introduce you to setting up the development environment of Draw2D. Next, according to the practice of the software industry, we need to present an example so that everyone is more interested in learning and exploring this technology. Let's talk about it. I will share with you the example of Draw2D from Dan Rubel, Jaimen Wren, and Eric Clayberg. This example includes two classes: GenealogyView and FigureMover. Among them, GenealogyView is a program that draws a three-port relationship. FigureMover is a mouse event listening program. Through this program, you can drag and drop a three-Port location. The effect of running the program is as follows.
Note: after running, the positions of the three squares above can be changed by dragging the cursor.
The specific program code is as follows:
(1) GenealogyView class: main program entry
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 figuresFigure root = new Figure();root.setFont(parent.getFont());XYLayout layout = new XYLayout();root.setLayoutManager(layout);// Add the father AndyIFigure 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 relationshipIFigure marriage = createMarriageFigure();root.add(marriage,new Rectangle(new Point(145, 35),marriage.getPreferredSize()));//Connect persons as marriage relationshiproot.add(connect(andy, marriage));root.add(connect(betty, marriage));root.add(connect(carl, marriage));// Create a canvas to display the root figureCanvas 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: drag and drop the program to listen
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 FigureMoverimplements 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-effectsbounds = 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) {}}
In the next section, I will share with you the code of this demo program. Stay tuned and look forward .......