Eclipse GEF (Part I)


Published on

Published in: Technology, Sports
1 Comment
  • part 2 ?
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Eclipse GEF (Part I)

  1. 1. Brief Introduction toEclipse GEF (Part I)Yongqiang
  2. 2. Outlines• What’s GEF?• Basic Concepts in GEF• Brief Introduction to Draw2d• Dive into a Real Case – How to draw a wafer and dies on it?• Summary• References
  3. 3. What’s GEF?• Stands for Graphical Editing Framework• A library to ease the task of building a graphical editor, in Eclipse• Model – View – Controller Architecture
  4. 4. Samples
  5. 5. Basic Concepts  Interaction Layer  Model-to-View mapping  Workbench Integration  Rendering  Layout  Scaling  Native (SWT) Layer
  6. 6. GEF Components & Dependencies ui.views GEF RCP SWT Draw2D Platform Runtime
  7. 7. Model View Controller• Hold all data you • Not hold any • Make the link want to be edited important data between M and V by the users • Know nothing • In GEF, controllers• Know nothing about the model are subclasses of about the view EditPart. • Must be• Must implement completely dumb some kind of notification • In GEF, view is mechanism built with Draw2d Figures
  8. 8. • Model Notification Mechanism• Dumb View
  9. 9. • MVC Working Together
  10. 10. Brief Introduction to Draw2d• a lightweight system of graphical components• Its purpose is only to show things on the screen, not to hold and manipulate any data.• Figures
  11. 11. • Painting of Figures• Bounds of Figures
  12. 12. • Interesting features • Layout Managers • Hit-testing • Events • Predefined types of Figures • Predefined types of Borders • Connections • Cursors and tooltips • Layers
  13. 13. Dive into a Real Case –How to draw a wafer and dies on it? Q: What is in your mind now? How to solve this problem? Die Wafer
  14. 14. Maybe…• We need to write a model to represent wafer, die and their relations.• We need to write the view to represent them on screen to users.• And also create subclasses of EditPart (controllers).
  15. 15. Model classes? Emm… seems easy! Just my own implementation. If you have better idea, let me know!  Q: What’s the relationship between Wafer and Die?
  16. 16. View classes (Let’s simplify it)• A wafer is a round plate.• A die is a square. Ellipse RectangleFigure If so, I believe there must be predefined figures in draw2d to represent ellipse and rectangle!
  17. 17. The next is the subclasses of EditPart!• Actually, we are going to use AbstractGraphicalEditPart (an abstract class which implements the interface of EditPart). a class org.eclipse.gef g «abstract» AbstractGraphicalEditPart + createEditPolicies() : void + createFigure() : IFigure Q: What is createFigure() used for? Q: How to derive it and create the link between model and view? Q: How many subclasses do we need? 1 or 2?
  18. 18. We need 2! One for Wafer, the other is for Die. Cover this line first!Return an Ellipse Tell GEF what is my model children
  19. 19. Return an DieRectangleFigure, ansubclass of RectangleFigure
  20. 20. All classes are ready! How to integrate them intoEclipse?• In Eclipse, editing action happens in some Editors!• We call such classes as EditorParts.• Graphical editing action also happens there! G class org.eclipse.gef.editpart EditorPart GraphicalEditor + setEditPartFactory(EditPartFactory) : void + setRootEditPart(RootEditPart) : void GraphicalViewer + setContents(Object) : void GraphicalEditorWithFlyoutPalette GraphicalEditorWithPalette
  21. 21. Oh, many new classes!  See this samplePalette GraphicalEditor GraphicalViewer
  22. 22. Data Flow Wait! the parameter is Object! How does GEF know it is a wafer objectWafer Data and create WaferPart? GraphicalEditor GraphicalViewer Wafer View WaferPart Die View DiePart
  23. 23. Let’s introduce EditPartFactory! EditoPartFactory will tell GEF the relationship between model classes and EditPart classes.
  24. 24. See the implementation…
  25. 25. Let’s create the Eclipse RCP App…• Omit N words…• Run it… Why are all diesthere?
  26. 26. Remember this feature?
  27. 27. So the covered line is…
  28. 28. Re-run the app…
  29. 29. Summary• You should know… • The basic concepts of GEF, draw2D and MVC archiecture • How to write model, view and controller • What GraphicalEditor and GraphicalViewer are. • How to use EditorPartFactory • How to use LayoutManager• Next, in Part II, I will cover… • how to add EditPolicy • how to do notification? • how to use EditDomain? • How to add Tool and Commands? • …
  30. 30. References• GEF Main Page (• Good GEF tutorial (,• Good Chinese GEF tutorial (,,