Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Combining
Graphics and Text
       in
 Modeling Tools
                    Jan Köhnlein
GMF
Graphical
GMF
          Graphical




 Xtext
Textual
GMF
             Graphical


Just two different views
   on the same thing


    Xtext
   Textual
Synchronization
Xtext
Xtext

              Textual Model


        Serializer
                     Parser
                              Node Mod...
Xtext
        XtextResource

                     Textual Model


               Serializer
                            Pa...
Xtext
        XtextResource

                     Textual Model


               Serializer
                            Pa...
Xtext                load(), save()



        XtextResource

                     Textual Model


               Serializ...
Xtext                load(), save()



        XtextResource

                     Textual Model


               Serializ...
ResourceSet


XtextResource                 DiagramResource
diagram
                                         change

                ResourceSet


XtextResource                 Diagr...
ResourceSet


XtextResource                 DiagramResource
reparse()
w/ errors

                    ResourceSet


    XtextResource                 DiagramResource
ResourceSet


XtextResource                 DiagramResource
ResourceSet


XtextResource                 DiagramResource




                Canonical
                EditPolicy
ResourceSet


XtextResource                 DiagramResource




                Canonical
                EditPolicy
ResourceSet


XtextResource                 DiagramResource




                Canonical
                EditPolicy
Fi e l
                    od a
                 M xtu
                  le l
                    Te
 ResourceSet         ...
Fi e l
                    od a
                 M xtu
                  le l
                    Te
 ResourceSet         ...
Fi e l
                    od a
                 M xtu
                  le l
                    Te
 ResourceSet         ...
Fi e l
                      od a
                   M xtu
                    le l
                      Te
 ResourceSet ...
Fi e l
                     od a
                  M xtu
                   le l
                     Te
 ResourceSet     ...
Fi e l
                     od a
                  M xtu
                   le l
                     Te
 ResourceSet     ...
Fi e l
                    od a
                 M xtu
                  le l
                    Te
 ResourceSet         ...
Demo Time
Create a Diagram
Save Diagram
Open Textual Model
Edit Textual Model
Save Textual Model
Edit Diagram
Reorder Objects
Diagram With Unsaved Changes
Try to Edit Text
Other Way Around...
Navigation
Popup Editor
Alignment
grammar org.xtext.cg2009.Entities
  with org.eclipse.xtext.common.Terminals

generate entities "http://www.xtext.org/cg200...
grammar org.xtext.cg2009.Entities
  with org.eclipse.xtext.common.Terminals

               Avoid empty
generate entities ...
grammar org.xtext.cg2009.Entities
  with org.eclipse.xtext.common.Terminals

               Avoid empty
generate entities ...
grammar org.xtext.cg2009.Entities
  with org.eclipse.xtext.common.Terminals

               Avoid empty
generate entities ...
Xtext
Xtext
        Implement a
         Formatter
Xtext
        Implement a
         Formatter


             Implement a
          FragmentProvider
Xtext
           Implement a
            Formatter


                 Implement a
              FragmentProvider



      ...
GMF
GMF

 Initialize
mandatory
properties
GMF

         Initialize
        mandatory
        properties



Avoid Phantom
    Nodes
Add a
transaction on
                                 GMF
     load



                    Initialize
                   m...
Glue Code
• Prevent conflicting modifications
• Navigate
 • diagram ➜ text
 • text ➜ diagram
    (needs index)
• Popup edito...
Thanks for your
  attention!

               More information at
                  www.itemis.de
                  www.xte...
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Combining Text and Graphics in Eclipse-based Modeling Tools
Upcoming SlideShare
Loading in …5
×

Combining Text and Graphics in Eclipse-based Modeling Tools

9,810 views

Published on

Lightning talk at EclipseCon 2010, Santa Clara, CA

Published in: Technology
  • Be the first to comment

Combining Text and Graphics in Eclipse-based Modeling Tools

  1. 1. Combining Graphics and Text in Modeling Tools Jan Köhnlein
  2. 2. GMF Graphical
  3. 3. GMF Graphical Xtext Textual
  4. 4. GMF Graphical Just two different views on the same thing Xtext Textual
  5. 5. Synchronization
  6. 6. Xtext
  7. 7. Xtext Textual Model Serializer Parser Node Model Ecore Model Instance
  8. 8. Xtext XtextResource Textual Model Serializer Parser Node Model Ecore Model Instance
  9. 9. Xtext XtextResource Textual Model Serializer Parser Node Model Ecore Model Instance getContents()
  10. 10. Xtext load(), save() XtextResource Textual Model Serializer Parser Node Model Ecore Model Instance getContents()
  11. 11. Xtext load(), save() XtextResource Textual Model Serializer Parser Node Model Ecore Model Instance FragmentProvider getContents() getURIFragment() getEObject()
  12. 12. ResourceSet XtextResource DiagramResource
  13. 13. diagram change ResourceSet XtextResource DiagramResource
  14. 14. ResourceSet XtextResource DiagramResource
  15. 15. reparse() w/ errors ResourceSet XtextResource DiagramResource
  16. 16. ResourceSet XtextResource DiagramResource
  17. 17. ResourceSet XtextResource DiagramResource Canonical EditPolicy
  18. 18. ResourceSet XtextResource DiagramResource Canonical EditPolicy
  19. 19. ResourceSet XtextResource DiagramResource Canonical EditPolicy
  20. 20. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource XtextResource DiagramResource
  21. 21. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource XtextResource DiagramResource
  22. 22. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource XtextResource DiagramResource
  23. 23. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource save() XtextResource DiagramResource
  24. 24. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource reload() XtextResource DiagramResource
  25. 25. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource reload() XtextResource DiagramResource
  26. 26. Fi e l od a M xtu le l Te ResourceSet ResourceSet XtextResource XtextResource DiagramResource
  27. 27. Demo Time
  28. 28. Create a Diagram
  29. 29. Save Diagram
  30. 30. Open Textual Model
  31. 31. Edit Textual Model
  32. 32. Save Textual Model
  33. 33. Edit Diagram
  34. 34. Reorder Objects
  35. 35. Diagram With Unsaved Changes
  36. 36. Try to Edit Text
  37. 37. Other Way Around...
  38. 38. Navigation
  39. 39. Popup Editor
  40. 40. Alignment
  41. 41. grammar org.xtext.cg2009.Entities with org.eclipse.xtext.common.Terminals generate entities "http://www.xtext.org/cg2009/Entities" Model : {Model} (entities += Entity)*; Entity returns Entity: 'entity' (name=ID)? ('extends' superType=[Entity])? '{' (properties+=Property)* '}'; Property: SimpleProperty | ReferenceProperty; SimpleProperty: 'property' (name=ID)? ':' type=('String'|'Number'|'Bool'); ReferenceProperty : (name=ID)? 'refs' ('one' | many?='many')? type=[Entity];
  42. 42. grammar org.xtext.cg2009.Entities with org.eclipse.xtext.common.Terminals Avoid empty generate entities "http://www.xtext.org/cg2009/Entities" models Model : {Model} (entities += Entity)*; Entity returns Entity: 'entity' (name=ID)? ('extends' superType=[Entity])? '{' (properties+=Property)* '}'; Property: SimpleProperty | ReferenceProperty; SimpleProperty: 'property' (name=ID)? ':' type=('String'|'Number'|'Bool'); ReferenceProperty : (name=ID)? 'refs' ('one' | many?='many')? type=[Entity];
  43. 43. grammar org.xtext.cg2009.Entities with org.eclipse.xtext.common.Terminals Avoid empty generate entities "http://www.xtext.org/cg2009/Entities" models Model : {Model} (entities += Entity)*; Entity returns Entity: 'entity' (name=ID)? ('extends' superType=[Entity])? '{' (properties+=Property)* '}'; Property: Cover mandatory SimpleProperty | ReferenceProperty; properties in SimpleProperty: validation 'property' (name=ID)? ':' type=('String'|'Number'|'Bool'); ReferenceProperty : (name=ID)? 'refs' ('one' | many?='many')? type=[Entity];
  44. 44. grammar org.xtext.cg2009.Entities with org.eclipse.xtext.common.Terminals Avoid empty generate entities "http://www.xtext.org/cg2009/Entities" Carefully select models Model : containment or cross {Model} (entities += Entity)*; references Entity returns Entity: 'entity' (name=ID)? ('extends' superType=[Entity])? '{' (properties+=Property)* '}'; Property: Cover mandatory SimpleProperty | ReferenceProperty; properties in SimpleProperty: validation 'property' (name=ID)? ':' type=('String'|'Number'|'Bool'); ReferenceProperty : (name=ID)? 'refs' ('one' | many?='many')? type=[Entity];
  45. 45. Xtext
  46. 46. Xtext Implement a Formatter
  47. 47. Xtext Implement a Formatter Implement a FragmentProvider
  48. 48. Xtext Implement a Formatter Implement a FragmentProvider Implement a JavaValidator
  49. 49. GMF
  50. 50. GMF Initialize mandatory properties
  51. 51. GMF Initialize mandatory properties Avoid Phantom Nodes
  52. 52. Add a transaction on GMF load Initialize mandatory properties Avoid Phantom Nodes
  53. 53. Glue Code • Prevent conflicting modifications • Navigate • diagram ➜ text • text ➜ diagram (needs index) • Popup editor • Shipped as an Xtext example
  54. 54. Thanks for your attention! More information at www.itemis.de www.xtext.org koehnlein.blogspot.com

×