Your SlideShare is downloading. ×
L0036 - Creating Views and Editors
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

L0036 - Creating Views and Editors


Published on

A detailed description of how to create and manage views, editors and perspectives.

A detailed description of how to create and manage views, editors and perspectives.

Published in: Education, Technology

  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide
  • \n
  • All Eclipse based applications – RCP or IDE – are made up of the same basic set of UI high level elements. The look-n-feel of these elements can be changed to some extent, but the basic semantics of each of the elements must remain the same. This is basically why all Eclipse-based applications look and feel the same.\nAn Eclipse RCP-based application can also interface with the host UI – e.g. adding icons and actions to the system tray.\nThere are exceptions to the rule about the Eclipse look-n-feel: The current school example is IBM Lotus Notes version 8.x (Hannover), which has a very different look.\nThe product element is the component that “decides” which exact application is started.\nProduct branding is basically the icons and images that are shown:\nDuring start of the application\nIn the task bar\nIn the help menu\n
  • The information model of the Eclipse workbench consists of a number of entities. These all have a UI representation except for Workbench and Perspective.\nThe information model is relative simple:\nA workbench consists of one or more workbench windows.\nEach workbench window has a top-level menu, a tool bar, a status line and a perspective switcher.\nEach workbench window has exactly one workbench page.\nEach workbench page has one or more perspectives.\nEach workbench page handles any number of editors and views.\nEach perspective provides a specific view of the editors and views of the page.\nEach view also has a view-local menu and tool bar.\n\nMost applications only have one window.\nMost UI resources in the application are handled on a per-window basis, which can be very important if the windows are shown on different monitors, in which case the low-level resources such as fonts and images must be handled specially.\nPlease note that the Resource API provides a view of the workspace of the user and this view is common to all workbench windows.\nAll editors and views are shared between all perspectives of a workbench window.\n
  • Almost all interaction with an Eclipse-based application is via editors and views. Other interaction is possible via the menu bar, the tool bar and the status line, but to a large extend these just represent fast access to the information that is already represented in editors or views. This fact is also stressed in the high-level menu and tool bar, as large parts of these are populated by the active editor.\nThe use of editors and views is different. Also some of the visual aspects of editors and views are different – in most cases as a direct consequence of the different usages of editors and views. (See next slide.) \nEditors are typically used to show and possibly change the information associated with an editor input. The classroom examples are Java files, a specific CRM contact, or a calendar appointment. The state of an editor is typically explicitly saved.\nViews are typically used to show information of more navigational or content-oriented nature. Again the classroom examples are search results, mail listings and progress information. Views are usually stateless – if they carry state, the state is implicitly saved when changed.\nThe UI representations of editors and views are shared between all pages of a workbench window but never between workbench windows.\n
  • It is important to understand the distinction between editors and views. Although the visual differences can be simulated using the Presentation API, there are some differences that cannot be removed as there are rooted in the basic information model of Eclipse.\nIt is possible to have multiple views of a specific type, but it is seldom used.\n
  • The three terms, site, reference and part, mean nearly the same thing. As a result, they are used in a very relaxed manner in many conversations.\nThe Java Workbench API is more specific, though, so it is therefore nice to know which is which.\nThe use of the reference object is primarily to prevent early activation of the plug-in of a view. All the things needed to identify the part in the UI are present in the reference object – e.g. the name, icon and state. Only when really needed in the UI – e.g. when a view is exposed – the part object itself is retrieved using getView() or getEditor().\n
  • \n
  • \n
  • A view is only created if needed – which may be never, if the view is never shown. Until needed a view is represented internally as a ViewReference. This avoids activating the plug-in until really needed.\nOnly createPartControl(Composite) and setFocus() are mandatory; the rest are optional.\n
  • Eclipse RCP and Eclipse Platform define a number of views that can be used directly in an application.\nProgress – shows the state of progress monitors (org.eclipse.ui)\nProperties – shows properties of the current selection (org.eclipse.ui.views)\nOutline – shows the outline of the data of the currently active editor (org.eclipse.ui.views)\n
  • The combination editor is called a multi-page editor. Some features of the workbench do not work optimally with a multi-page editor – e.g. the global toolbar.\nThe editor model is not (yet) general enough to support nested editors. This is a problem in some special cases – e.g. when files are compared.\n
  • Working with editors is a lot more complicated than working with views, as they must manage a state that can be saved.\nAs editors often work with a text file, it is even more complicated. This is also illustrated in the supported packages and classes used for this.\nAll the intricate details of working with editors are part of the modules “L0040 - Creating an Editor” and “L0042 - Creating a Language Editor”.\n\nWorking with standard views, such a Problems, Outline and the Package Explorer, is covered in the module “L0043 - Interfacing to Eclipse Standard Views”.\nThe declaration and implementation of an editor extension is more complicated than corresponding view extension for a number of reasons:\nThe type of the resources must be specified. Today the file name extensions of the relevant resources are specified, but there is a move to specify the content type instead. This will make it easier to work with IEditorInputs that are not IFileEditorInputs and to work with extension-less files. The latter is important when editing command files under Unix where the command interpreter is part of the text itself and not part of the file name.\nWorking with IEditorInputs can be troublesome, as the content of the input might not be available immediately. This means the “reading” of the input must be put into independent threads. The same goes for saving. See the module “L0005 - Job Management and Progress Monitors” for more information on how to “do things” in the background.\nWorking with text-based editors is a chapter in itself. Please refer to the module “L0040 - Creating an Editor” for more information.\n
  • Please note that IEditorInput.equals(…) is used to determine if two editor inputs refer to the same underlying resource. This in turn is used to avoid opening the same resource multiple times.\n
  • An editor is only created if needed, just like views.\nAll of the methods listed above are mandatory.\nIf you really need an editor, using the Extension template for the extension point provides a good starting point.\n
  • Now it’s time for the lab.\nThe exercise is easy: create a view using UI designer such as SWT Designer or the Visual Editor. Try to simulate as close as possible one of the views on the page.\nThe three dialogs are\nTop left: The general preference page (“Windows”→”Preferences…”)\nRight: The search dialog\nBottom left: The layout customization dialog for GridLayout in VE.\n
  • \n
  • \n
  • \n
  • \n
  • Each workbench window contains one or more perspectives in the form of workbench pages. A perspective defines the initial set and layout of views in the workbench window. \nThere can never be more than one editor in any perspective, but it is possible to hide the editor in specific perspectives.\nThe active set of perspectives is shown in the perspective switcher. It is possible to specify a set or perspective that will be shown at top of the list when the “Show Perspective” button is shown.\nLikewise it is possible to specify a set of “new” wizards and views to be shown in their respective menus.\nPerspectives control what appears in certain menus and tool bars. They define visible action sets, which you can change to customize a perspective. You can save a perspective that you build in this manner, making your own custom perspective that you can open again later.\nFor RCP-based applications the use of perspectives can make the difference between a messy application and an application that is intuitive. Thinking in turns on tasks or use-cases usually provides the most intuitive set of perspectives. E.g.\nMail\nCalendar\nCRM (often more than one perspective)\nCurrent tasks and deadlines\nTime management\nInternal news and notice board\nManuals and procedures\nEtc…\n
  • The perspective of the Eclipse IDE is probably the best source of how to set up perspectives. Nearly all possible layouts can be found here!\n
  • Perspectives are an additional organizational layer inside a workbench window. A perspective defines a collection of views, a layout for the views, and the visible action sets that should be used when the user first opens the perspective.\n
  • \n
  • Designing the visual layout of a new perspective can seem difficult at first, but by following the simple rules above nearly any layout can be generated. Holes can even be added. The next slide contains a real-world example.\nFor a vertical split, the part on top gets the specified ratio of the current space and the part on bottom gets the rest. Likewise, for a horizontal split, the part at left gets the specified ratio of the current space and the part at right gets the rest.\nA few types of layout cannot be created this way – like the example shown above. Currently there is no way to create this as an initial layout. To my knowledge it is not even possible to re-arrange a perspective into this layout!\nAll this really should be an addition to the extension, but for now code is required. See org.eclipse.ui.perspectiveExtensions for an example of how it could be done.\nA simple trick: use the perspectives extension point to define the perspective (this requires the implementation of IPerspectiveFactory which can then be empty) and then use perspectiveExtensions to add the views in a declarative manner. It is not possible to specify everything this way – e.g. whether an editor is shown or hidden.\n
  • \n
  • Step by step we have:\nLine 3: we have a virgin layout, which by definition contains exactly the editor.\nLine 4: we have removed the editor – or rather made it “invisible”.\nLine 5: we have added view#1 to the left of the (invisible) editor. It will take up 100% of the original areas – i.e. all of it! Note that it could just as well have been on the right side of the (invisible) editor.\nLine 6: we have added view#2 to the left of view#1. It will take 66% of the space originally taken by view#1.\nLine 7: we have added view#3 to the bottom of view#2. It will take 25% of the space originally taken by view#2. This means 75% will be taken by the (existing) TOP view.\nLine 8: we have added view#4 to the left of view#2. It will take 50% of the space originally taken by view#2.\nResult should be that view#1, view#2 and view#4 have the same width (or very close to).\nThe trick is to continuously divide a part into two new parts according to the specification. \n
  • If it seems difficult to design a specific perspective, then have a look at one of the existing perspectives from Eclipse IDE!\nWhen a view is added as a placeholder it does not show up until it is explicitly added by the user. As all views are added by ID, the view does not even have to be implemented in the current executable.\n
  • One may wonder why the specification of a perspective cannot be performed using the same type of extension point. With a simple trick this can be done, though:\nFirst create the perspective as usual and simply hide or show the editor.\nPerform the rest of the configuration via the perspectiveExtensions extension point.\n
  • Now it’s time for the lab.\n
  • Now it’s time for the lab.\n
  • As can be seen the workbench window is the interesting item that is needed first. From this the current active workbench page is found (which corresponds to the current perspective).\nThe IDE class contains a large number of methods that can be used to open a new editor depending on the available information.\n
  • \n
  • Transcript

    • 1. Creating Views and EditorsA detailed description of how to create and manage views, editors andperspectives.Redistribution and other use of this material requires written permission from The RCP Company.L0001 - 2010-11-27
    • 2. Views and Editors in Eclipse ApplicationsIn any Eclipse Application (RCP or IDE) theprimary user interface is via views and editorsorganized in one or more perspectives2 L0001 - 2010-11-27
    • 3. Basic Eclipse UI Information Model Workspace Window Top-level Menu Page Perspective Top-level Toolbar Status Line Editors Views Switcher Local Toolbar Drop-Down Menu3 L0001 - 2010-11-27
    • 4. Editors and ViewsThe main functionality of an Eclipse application is handled via editors andviews and the actions provided by theseThe use of editors and views is different  Editors express the state of one or more editor inputs – typically file resources  Editors have an associated life-cycle  Views express additional navigational or context-oriented information – e.g. problems, outline or search – and is usually stateless  Views have no state, only configuration – e.g. colors and column directionsEditors are explicitly saved whereas views are implicitly savedEditors and views are grouped together via perspectives4 L0001 - 2010-11-27
    • 5. Visual Differences between Editors and ViewsThese are some visual differences between editors and views:  Editors provide additional actions to the top-level menu and the tool bar; views do not  Views have an independent menu bar and tool bar; editors do not  There are at most one active editor in a perspective; there can be any number of active views  The are at most one view of each “type”; there can be any number of editors  Editors are all placed in the “editor area”; views are placed in a number of “view stacks”Using the Presentation API, the visual difference can be ironed out5 L0001 - 2010-11-27
    • 6. Sites, Parts and ReferencesViews and Editors are represented in threedifferent ways in the workbench page:  The site object (IViewSite and IEditorSite) Site represents the workbench state that is specific for a part  Access to the workbench, the workbench window, and the workbench page  Access to the ID and name of the part Reference (from the view or editor extension)  Registration of context menus  The part object (IViewPart and IEditorPart) represents the actual part of a site Part  This comes from the developed plug-in  The reference object (IViewReference and IEditorReference) represents a reference to a specific part object  Used to prevent premature activation of plug-ins6 L0001 - 2010-11-27
    • 7. ViewsThe Editor IDE contains views with all sorts of content. Some relevantexamples are:  A table with items: Problems  A styled text: Javadoc  A big (virtual) tree: Package Explorer  Using the Forms UI: Properties (depends on the current editor)  A graph: Metrics  A view with content supplied by the editor: Outline  Tables and trees with sorting and filtering: Problems and OutlineIf in doubt about how to implement a specify feature, always have a look atthe views from the IDE. Although these sometimes can seem overlycomplicated, they can provide good inspiration.7 L0001 - 2010-11-27
    • 8. Adding a ViewViews are defined via the extension point org.eclipse.ui.views/view  Has id, name, class, category, icon, fastViewWidthRatio, allowMultiple, restorable and description (a sub-element)  Most attributes are optional <extension point="org.eclipse.ui.views"> <view category="com.rcpcompany.cexx.viewCategories.Main" class="com.rcpcompany.cexx.views.ContactTableView" id="com.rcpcompany.cexx.views.ContactTableView" name="Contact Table" restorable="true"> <description> This view contains a simple table with all defined contacts along with a filter. </description> </view> </extension>8 L0001 - 2010-11-27
    • 9. View Life CycleBefore the view is shown  init(IViewSite) or init(IViewSite, IMemento): marks the start of the view. The second version is called for views that have saved a memento  createPartControl(Composite): Creates the visual content of the view  setFocus(): Sets the initial focus of the viewWhen the view is closed  saveState(IMemento): Saves the state of the view in a memento  dispose(): Disposes all resources – especially images and fonts9 L0001 - 2010-11-27
    • 10. Standard Views (RCP only) The platform contains a number of standard views that can be added to an RCP application via plugin.xml For example, to add the Progress view, use: <extension point="org.eclipse.ui.views"> <view class="org.eclipse.ui.ExtensionFactory:progressView" id="com.rcpcompany.gir.application.views.progress" name="Progress"/> </extension>10 L0001 - 2010-11-27
    • 11. Editors Content  Text – e.g. a programming language  Graphical – e.g. a model or an XML file  Form – e.g. an XML file or a configuration file  A combination – e.g. the plugin.xml editor11 L0001 - 2010-11-27
    • 12. Editors Interface more complicated than for views, with many more mandatory methods  Saving editor content (ISaveablePart)  Introduces IEditorInput12 L0001 - 2010-11-27
    • 13. Editor Input The subject of an editor is specified via an IEditorInput  Simple interface: public interface IEditorInput extends IAdaptable { public boolean exists(); public ImageDescriptor getImageDescriptor(); public String getName(); public IPersistableElement getPersistable(); public String getToolTipText(); }  Typically a file based on the resource API  But can be anything – specialized as  IPathEditorInput: Local file system resource  IFileEditorInput: Resource API-based resource  IStorageEditorInput: Storage-based resource – any sequence of bytes Subclass EditorInput for your own new editor inputs13 L0001 - 2010-11-27
    • 14. Editor Life Cycle Before the view is shown  init(IEditorSite, IEditorInput): marks the start of the editor  createPartControl(Composite): Creates the visual content of the editor  setFocus(): Sets the initial focus of the editor When the editor is closed  isDirty() and isSaveAsAllowed(): Returns whether saving is needed or indeed allowed  Used by workbench to determine whether exit is allowed  doSave(IProgressMonitor) or doSaveAs(): Saves the state of the editor  dispose(): Disposes all resources – especially images and fonts14 L0001 - 2010-11-27
    • 15. Lab Exercise Create a number of views using the UI designer  If you use the Visual Designer, then start Eclipse 3.2 with its own workspace and import the existing plug-ins!15 L0001 - 2010-11-27
    • 16. Saving State (IMemento) When the workbench closes, all state is saved – including all workbench-related state When the workbench is reopened, all state is re-read State saved in an IMemento  Hierarchical structure  Normally XML based  Data can be  Strings, integers or floats  Text blocks The view life cycle explicitly handles state  init(IViewSite, IMemento)  saveState(IMemento) Saved as file in the local configuration directory  Can be saved anywhere  Workbench reads file workbench.xml16 L0001 - 2010-11-27
    • 17. Saving State (IMemento) The IMemento interface has three groups of operations:  Operations to get or create a child context  Operations to get or set the values of a context  A few operations to handle the IDs public interface IMemento { public IMemento createChild(String type); public IMemento createChild(String type, String id); public IMemento getChild(String type); public IMemento[] getChildren(String type); public Float getFloat(String key); public String getID(); public Integer getInteger(String key); public String getString(String key); public String getTextData(); public void putFloat(String key, float value); public void putInteger(String key, int value); public void putMemento(IMemento memento); public void putString(String key, String value); public void putTextData(String data); }17 L0001 - 2010-11-27
    • 18. Saving State in Views and Editors The view life cycle explicitly handles state  init(IViewSite, IMemento)  Will be null the first time!  saveState(IMemento)  Because views are shared between perspectives, init and saveState will only be called once per WorkbenchWindow! In Eclipse 3.3 an editor can also save state  Must implement IPersistableEditor  restoreState(IMemento)  saveState(IMemento)18 L0001 - 2010-11-27
    • 19. Lab Exercise Save and restore the content of the first text field of the first view using IMemento:  In WorkbenchAdvisor.preStartup() use getWorkbenchConfigurer().setSaveAndRestore(true) to enable saved state (RCP only)19 L0001 - 2010-11-27
    • 20. Perspectives A perspective is a description of a number of user interface elements that is used to perform a specific task  Whether or not an editor is used  A specific type of resources that will be shown in the navigator (if used)  A specific set of views that is used in the perspective  A specific set of shortcuts to be added to certain menus  Wizards to be shown at the top of the “File” → “New…” menu  Views to be shown at the top of the “Window” → “Show View” menu  Perspectives shown at the top of the perspective switcher  A specific set of action sets to be added to the top-level menu and tool bar A perspective also specifies the layout of the editors and the associated views using a “slice” system Additions can be made to a perspective using the perspectiveExtensions extension point20 L0001 - 2010-11-27
    • 21. Standard Perspectives The Eclipse IDE includes a large number of perspectives that correspond to the many tasks that must be performed in a development environment. For example:  Java  Debug  Team  CVS Repository21 L0001 - 2010-11-27
    • 22. Perspective Implementation Perspective is a specific layout and views and editors within a Workbench window Workspace Window Top-level Menu Page Perspective Top-level Toolbar Status Line Editors Views Switcher Local Toolbar Drop-Down Menu22 L0001 - 2010-11-27
    • 23. Adding a New Perspective A new perspective can easily be added using the extensions page for the plugin.xml file  Add a new extension with the name “org.eclipse.ui.perspectives”  Select the new line and add a “New”→”perspective” using the context menu  Specify ID, name and factory class  Click on the “class” link to create the new View class automatically23 L0001 - 2010-11-27
    • 24. Designing Perspectives Nearly any layout with an editor (optional) and zero, one or more views can be designed using addView(…) The method is rather simple:  You start with the editor area  You then add one new view at a time  Each time, you divide an already placed view according to an edge (TOP, RIGHT, BOTTOM, or LEFT) and a percentage (in the range [0.05; 0.95]) Thus addView("view2", IPageLayout.LEFT, 0.4f, "view1") means  Find the already placed view view1  Place view2 to the LEFT of view1  Assign 40% of the original area of view1 to view224 L0001 - 2010-11-27
    • 25. Designing Perspectives 1 2 4 Some layouts cannot be created this way – for example, this “ wheel” layout 325 L0001 - 2010-11-27
    • 26. Designing Perspectives An Example The parts of layout (the editor and the four views) are represented by the rectangles The numbers refers to the next start of the line to be executed Editor 3 Area 4 5 View1 View2 View4 View2 6 View2 View1 7 View1 8 View1 View3 View3 public void createInitialLayout(IPageLayout layout) { final String area = layout.getEditorArea(); layout.setEditorAreaVisible(false); layout.addView("com.rcpcompany.cex.view1", IPageLayout.LEFT, 1.0f, area); layout.addView("com.rcpcompany.cex.view2", IPageLayout.LEFT, 0.666f, "com.rcpcompany.cex.view1"); layout.addView("com.rcpcompany.cex.view3", IPageLayout.BOTTOM, 0.75f, "com.rcpcompany.cex.view2"); layout.addView("com.rcpcompany.cex.view4", IPageLayout.LEFT, 0.5f, "com.rcpcompany.cex.view2"); }26 L0001 - 2010-11-27
    • 27. Designing Perspectives Views can be added to a designated spot in a number of ways  As a normal view with tab using addView(…)  As a view with no tab using addStandaloneView(…)  As a stack or folder using createFolder(…)  As a fast view using addFastView(…) Views can also be added as a placeholder for a future view using addPlaceholder(…) or createFolderPlaceholder(…) The editor area has ID org.eclipse.ui.editorss (with ss!) Views can be set un-closeable or un-moveable via getViewLayout(id) See IPageLayout for more information27 L0001 - 2010-11-27
    • 28. Extending an Existing Perspective Used when extending an existing perspective with information from a new (usually independent) plug-in  E.g. adding a new profile view to the Java perspective Using extension point org.eclipse.ui.perspectiveExtensions  Specify the target perspective ID  Can add fast views, action set, shortcuts  Cannot hide or show the editor28 L0001 - 2010-11-27
    • 29. Lab Exercise Implement the following perspective using four views via a Java class  You make the perspective switcher visible in the WorkbenchWindowAdvisor.preWindowOpen() (RCP Only): configurer.setShowPerspectiveBar(true) Then re-implement the layout in a new perspective using the perspectiveExtensions extension point  Or just add a new view to the old existing perspective Later possibly move view3 to a fast view Make view1 not moveable in both perspectives Add the new perspective as a shortcut in the old perspective – using perspectiveExtensions Stack with View2 and View 4 View1 View329 L0001 - 2010-11-27
    • 30. Lab Exercise Implement the following perspective using four views Stack with View2 and View 4 Editor View1 Area View3 Add one of the above views to the existing Resource perspective using the perspectiveExtensions extension point  The ID of the Resource perspective is org.eclipse.ui.resourcePerspective  The ID of the Task view is org.eclipse.ui.views.TaskList30 L0001 - 2010-11-27
    • 31. How to open editors, views and perspectives Perspectives  IWorkbenchWindow.openPage(String perspectiveId, IAdaptable input) Editors  IDE.openEditor(IWorkbenchPage page, IFile file)  One of a large number of methods  IWorkbenchPage.findEditor(IFile file) Views  IWorkbenchPage.showView(String id)  Will open the view in the site according to the perspective definition31 L0001 - 2010-11-27
    • 32. More Information “Using Perspectives in the Eclipse UI”  Visual Editor Project  Advanced workbench concepts from Eclipse Help  org.eclipse.platform.doc.isv/guide/wrkAdv.htm “Code Access Guide to Eclipse 3.4”   Among other things an introduction to the PDE Spy.32 L0001 - 2010-11-27