Einführung in das Graphical Editor Framework Tutorial, iX-Konferenz 2005.1 13.6.2005, nh-Hotel, Heidelberg Dr. Boris Bokowski <bokowski@acm.org>

Maßgeschneiderte grafische Editoren mit GEF Kontext GEF – Graphical Editor Framework Existiert seit ca. fünf Jahren Ursprünglich com.ibm.etools.gef, dann org.eclipse.gef Basis für graphische Editoren in IBM-Produkten (z.B. WSAD) Wird zunehmend in Open Source- und kommerziellen Produkten verwendet Einbindung in Eclipse Einbindung in das Top-Level-Projekt "Eclipse Tools" Versionsnummern sind synchron zu Eclipse Platform Aktuelle Version: 3.0.1 Nächste Version: 3.1, Mitte 2005 Releases in der Regel eine Woche nach Eclipse Platform © 2005 by Boris Bokowski; made available under the EPL v1.0

Graphical Editor Framework Screenshots © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Gliederung Set-Up Features von GEF Hello, World Architektur von GEF Hands-On: Schrittweise Weiterentwicklung von Hello World Hands-On: Ein fertiger Beispieleditor © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Set-Up © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Set-Up Eclipse 3.1 RC2 eclipse-SDK-3.1RC2-win32.zip entpacken, z.B. nach C:\GEF-Tutorial (Optional: JRE jre.zip entpacken, nach C:\ GEF-Tutorial\eclipse) Workspace: GEF, GEF-Examples, Tutorial-Projekte workspace.zip entpacken, nach C:\GEF-Tutorial Eclipse starten C:\GEF-Tutorial\eclipse\eclipse.exe Als Workspace auswählen: C:\GEF-Tutorial\workspace Häkchen bei Default Welcome-View schließen © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Set-Up – Import von Plug-Ins Inkrementellen Compiler temporär ausschalten

Maßgeschneiderte grafische Editoren mit GEF Set-Up Import der vorbereiteten Projekte File->Import… 2 1 3 4 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Set-Up Close Projects Inkrementellen Compiler wieder anschalten 1 2 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Features © 2005 by Boris Bokowski; made available under the EPL v1.0

Empfehlungen zum Vorgehen Was ist einfach, was ist aufwändig Shapes Connections Layers Nesting Palette Menu Tools Printing Direct Edit Undo/Redo Handles Ruler Accessibility Grid, Snap Zoom Animation Layout Overview Integration © 2005 by Boris Bokowski; made available under the EPL v1.0

Features Shapes Example Integration Connections Shapes © 2005 by International Business Machines; made available under the EPL v1.0

Features Flow Example Tools Layout Nesting Animation © 2005 by International Business Machines; made available under the EPL v1.0

Features Logic Example Palette Undo/Redo Zoom Ruler © 2005 by International Business Machines; made available under the EPL v1.0

Features METUS Handles Accessibility Direct Edit Layers © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Features GEF-Examples ausprobieren Run->Run… 2 3 1 4 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Features File->New->Project… "Testprojekt" eingeben, Finish File->New->Example… Window->Show View->Other…, Basic->Palette © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Features © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Demo © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World 3 1 2 4 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World 6 5 7 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World 9 8 10 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World package de.eclipseteam.geftutorial.simple.views; import org.eclipse.swt.widgets.Composite; import org.eclipse.ui.part.ViewPart; public class SampleView extends ViewPart { public void createPartControl(Composite parent) { // TODO Auto-generated method stub } public void setFocus() { © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World 2 3 1 4 © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World public class SampleView extends ViewPart { private GraphicalViewer graphicalViewer; public void createPartControl(Composite parent) { graphicalViewer = new GraphicalViewerImpl(); graphicalViewer.createControl(parent); graphicalViewer.setEditDomain(new EditDomain()); graphicalViewer.setEditPartFactory(new EditPartFactory() { …… }); graphicalViewer.setContents(new Object()); } public void setFocus() { © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Hello, World public EditPart createEditPart(EditPart context, Object model) { EditPart result = new AbstractGraphicalEditPart() { protected IFigure createFigure() { return new Label("Hello, World"); } protected void createEditPolicies() { }; result.setModel(model); return result; © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Architektur © 2005 by Boris Bokowski; made available under the EPL v1.0

Architektur Plug-In-Abhängigkeiten GEF ui.views RCP SWT Draw2D Platform Runtime © 2005 by International Business Machines; made available under the EPL v1.0

Architektur Schichten Interaction Layer Model-to-View mapping Workbench Integration Rendering Layout Scaling Native (SWT) Layer © 2005 by International Business Machines; made available under the EPL v1.0

Architektur Model-View-Controller Figure Refresh Commands Notification EditPart Events / Requests © 2005 by Boris Bokowski; made available under the EPL v1.0

Keine Annahmen in GEF, was das Modell angeht. Architektur Modell Keine Annahmen in GEF, was das Modell angeht. Sinnvoll sind: Notification bzw. Observer-Pattern Command-Pattern Persistenz Keine Abhängigkeit zu Controller oder View Möglichkeiten: Java Beans, PropertyChangeSupport Eclipse Modeling Framework (EMF) © 2005 by Boris Bokowski; made available under the EPL v1.0

Vieles in Draw2D vorhanden Architektur View View-Klassen Vieles in Draw2D vorhanden Ansonsten Unterklasse von org.eclipse.draw2d.Figure Draw2D Toolkit auf der Basis von SWT Figure, Layout, Layer, Scrolling, Events, … Kann unabhängig von GEF verwendet werden © 2005 by Boris Bokowski; made available under the EPL v1.0

Architektur Figures (Draw2D) 1 2 3 6 1 6 2 3 4 5 5 4 © 2005 by International Business Machines; made available under the EPL v1.0

Architektur Layouts (Draw2D) BorderLayout FlowLayout Top 1 2 Left Center Right 3 4 Bottom XYLayout ToolbarLayout 1 2 3 12,8,20,10 30,20,27,14 © 2005 by International Business Machines; made available under the EPL v1.0

Architektur Controller EditPart (i.d.R.) ein EditPart-Objekt pro Modell-Objekt Genauer: ein EditPart-Objekt pro Einheit, die für sich selektierbar / editierbar / löschbar sein soll Zuständigkeiten Erzeugung des Figure-Objekts Bestimmung der enthaltenen Objekte Aktualisierung des Figure-Objekts bei Modelländerungen Umsetzung von Requests in Commands Erzeugung von EditParts durch eine Factory © 2005 by Boris Bokowski; made available under the EPL v1.0

Architektur Erzeugung von EditParts GraphicalViewer EditPart Factory Model EditParts Figures @#! © 2005 by International Business Machines; made available under the EPL v1.0

Hands-On Schrittweise Erweiterung von Hello, World Schritt 2: Liste von Strings Schritt 3: Editierbarkeit (Verschieben) Schritt 4: Editierbarkeit (Nesting) Schritt 5: … Schritt 6: Überraschung! © 2005 by Boris Bokowski; made available under the EPL v1.0

Architektur Kontrollfluss im Detail EditPart EditPolicy Requests Commands Tool EditPart SWT Canvas SWT Events Requests Commands Stack Commands ? © 2005 by International Business Machines; made available under the EPL v1.0

Hands-On Schrittweise Erweiterung von Hello, World Schritt 2: Liste von Strings Schritt 3: Editierbarkeit (Verschieben) Schritt 4: Editierbarkeit (Nesting) Schritt 5: BulletBorder Schritt 6: Outline Editor! © 2005 by Boris Bokowski; made available under the EPL v1.0

Architektur Sonstiges Connections Sind grundsätzlich gerichtet Start- und Endpunkt sind Anchor-Objekte Commands Undo/Redo CommandStack Palette Enthält Tools Gruppiert in Ordnern U.v.m… © 2005 by Boris Bokowski; made available under the EPL v1.0

Empfehlungen zum Vorgehen Cheat Sheet Unterklasse von GraphicalEditor EditDomain, EditPartFactory, Top-Level-Modellobjekt setzen Pro EditPart: Erzeugung des Objekts in der EditPartFactory createFigure() Figure erzeugen refreshVisuals() Figure aktualisieren getModelChildren() Nesting activate(), deactivate() Notification einrichten createEditPolicies() Editierbarkeit konfigurieren (Command-Objekte erzeugen) Für Connections: getModelSourceConnections() ausgehende Verbindungen getModelTargetConnections() eingehende Verbindungen createEditPolicies() Palette, Tools, Handles, Drag and Drop, … © 2005 by Boris Bokowski; made available under the EPL v1.0

Empfehlungen zum Vorgehen Informationsquellen High-Level-Overview GEF-Tutorial von der EclipseCon 2005 GefDescription auf eclipsewiki Anleitungen "Maßgeschneiderte grafische Editoren", Boris Bokowski, Frank Gerhardt Eclipse Magazin Vol. 2 Artikel auf www.eclipse.org "A Shape Diagram Editor", Bo Majewski (Cisco) "Using GEF with EMF", Chris Aniszczyk (IBM) "Building a Database Schema Diagram Editor with GEF", Phil Zoio (Realsolve Solutions) Buch SWT in Action (Manning), enthält ca. 50 Seiten zu GEF (Anhang) © 2005 by Boris Bokowski; made available under the EPL v1.0

Maßgeschneiderte grafische Editoren mit GEF Fragen? © 2005 by Boris Bokowski; made available under the EPL v1.0