gwt-connectors ist eine GWT-Bibliothek, um Formen miteinander zu verbinden.
Die Präsentation zeigt, wie das geht.
Wer’s selber ausprobieren möchte, schaut unter demo (IE, Firefox, Opera, Chrome). (Aber wie kann man nun die Verbindung wieder lösen …)
Der nötige Programmcode ist kurz:
// Create boundary panel
AbsolutePanel boundaryPanel = new AbsolutePanel();
boundaryPanel.setSize("600px", "400px");
RootPanel.get().add(boundaryPanel, 10, 10);
Diagram diagram = new Diagram(boundaryPanel);
boundaryPanel.add(new Label("Connectors example"), 10, 2);
// Add connectors
Connector connector1 = new Connector(50, 80, 100, 100);
connector1.showOnDiagram(diagram);
Connector connector2 = new Connector(350, 200, 270, 80);
connector2.showOnDiagram(diagram);
Connector connector3 = new Connector(450, 120, 500, 80);
connector3.showOnDiagram(diagram);
// Add some elements that can be connected
Label label = new Label("LABEL");
Image image = new Image("http://code.google.com/images/code_sm.png");
HTML html = new HTML("<b>HTML<br>ELEMENT</b>");
boundaryPanel.add(label, 50, 270);
boundaryPanel.add(image, 180, 250);
boundaryPanel.add(html, 450, 250);
Shape shapeForLabel = new Shape(label);
shapeForLabel.showOnDiagram(diagram);
Shape shapeForImage = new Shape(image);
shapeForImage.showOnDiagram(diagram);
Shape shapeForHtml = new Shape(html);
shapeForHtml.showOnDiagram(diagram);
Ich bin gespannt, wann es das erste UML-Tool mit GWT gibt. gwt-connectores basiert im Übrigen auf Fred Sauer’s gwt-dnd. (Dazu auch das Demo http://allen-sauer.com/com.allen_sauer.gwt.dnd.demo.DragDropDemo/DragDropDemo.html.)
Dazu passt auch die Ankündigung von http://googledocs.blogspot.com/2009/03/drawing-on-your-creativity-in-docs.html, ein Zeichenwerkzeug in Google Docs einzubetten:
http://www.googlewatchblog.de/2009/03/26/google-docs-drawing-veroeffentlicht/ hat dazu ebenfalls ein Bild parat:
