Contributing to the Property Sheet

Prerequisite

Contributing to the property sheet is done using the standard Eclipse extension point for registering tabbed property sheets. Add a dependency to the plugin org.eclipse.ui.views.properties.tabbed in the plugin.xml resp. manifest.mf, which contains eclipse functionality for property sheets.

Note: It is also possible to use the standard Eclipse property sheets. In order to enable that you need to provide a org.eclipse.ui.views.properties.PropertySheetPage instead of the default org.eclipse.ui.views.properties.tabbed.TabbedPropertySheetPage(ITabbedPropertySheetPageContributor) in the getAdapter() method of DiagramEditor.

Contributing to the Property Sheet

Contributing to the property sheet is easy if you are familiar with the Eclipse property sheet concept. If not please read the following article.

First you have to add some declarations to your plugin.xml.

 

 <extension
    point="org.eclipse.ui.views.properties.tabbed.propertyContributor">
    <propertyContributor contributorId="mytutorial.PropertyContributor">
        <propertyCategory category="Graphiti">
        </propertyCategory>
    </propertyContributor>
</extension>
      
<extension
      point=
"org.eclipse.ui.views.properties.tabbed.propertyTabs">
   <propertyTabs
          contributorId=
"mytutorial.PropertyContributor">
   <propertyTab
         category=
"Graphiti"
         id=
"graphiti.main.tab"
         label=
"Main">
    </propertyTab>
   </propertyTabs>
</extension>
    
<extension
      point=
"org.eclipse.ui.views.properties.tabbed.propertySections">
    <propertySections
          contributorId=
"mytutorial.PropertyContributor">
        <propertySection
              class=
"org.eclipse.graphiti.examples.tutorial.property
                    .MyTutorialEClassSection"

              filter=
"org.eclipse.graphiti.examples.tutorial.property
                     .MyTutorialEClassFilter"

              id=
"graphiti.main.tab.emfclass"
              tab=
"graphiti.main.tab">
        </propertySection>
    </propertySections>
</extension>

 

The first extension creates a category with the id "Graphiti". Categories are used to group tabs.

The second extension creates a tab with the label "Main" in the previously created category.

The third extension creates a section for the previously defined tab. Sections are the UI blocks of which a tab consists.

It is very important, that the contributorId in the plugin.xml is the same, which is determined internally in Graphiti. The contributorId is calculated from the diagram-type-id by the formula: Diagram.getDiagramTypeId() + ".PropertyContributor".

In our example this results in contributorId="mytutorial.PropertyContributor".

Note that the category “Graphiti” and the identifiers “graphiti.main.tab” and “graphiti.main.tab.emfclass” can be chosen freely, as long as they are kept consistent over all occurrences.

In our example the section should be shown if the selected element represents a EClass. Therefore we have to implement a property filter class by extending AbstractPropertySectionFilter and overwriting the method accept.

You can see the complete implementation of the property filter here:

 

package org.eclipse.graphiti.examples.tutorial.property;
 
public class MyTutorialEClassFilter extends AbstractPropertySectionFilter {
 
    @Override
    protected boolean accept(PictogramElement pe) {
        EObject eObject =
            Graphiti.getLinkService()
            .getBusinessObjectForLinkedPictogramElement(pe);
        if (eObject instanceof EClass) {
            return true;
        }
        return false;
    }
}

 

Finally we have to implement a property section class which creates the UI shown in the tab using standard SWT controls (refer to the article mentioned above). This class should extend GFPropertySection, which offers some convenience methods to retrieve the selected Pictogram Element or execute Features.

In this example we create a simple UI, which allows displaying and changing the name of a EClass.

You can see a very simple implementation of the property section here:

 

package org.eclipse.graphiti.examples.tutorial.property;
 
public class MyTutorialEClassSection extends GFPropertySection implements
    ITabbedPropertyConstants {
 
    private Text nameText;
 
    @Override
    public void createControls(Composite parent,
        TabbedPropertySheetPage tabbedPropertySheetPage) {
        super.createControls(parent, tabbedPropertySheetPage);
 
        TabbedPropertySheetWidgetFactory factory = getWidgetFactory();
        Composite composite = factory.createFlatFormComposite(parent);
        FormData data;
 
        nameText = factory.createText(composite, "");
        data = new FormData();
        data.left = new FormAttachment(0, STANDARD_LABEL_WIDTH);
        data.right = new FormAttachment(100, 0);
        data.top = new FormAttachment(0, VSPACE);
        nameText.setLayoutData(data);
 
        CLabel valueLabel = factory.createCLabel(composite, "Name:");
        data = new FormData();
        data.left = new FormAttachment(0, 0);
        data.right = new FormAttachment(nameText, -HSPACE);
        data.top = new FormAttachment(nameText, 0, SWT.CENTER);
        valueLabel.setLayoutData(data);
    }
 
    @Override
    public void refresh() {
        PictogramElement pe = getSelectedPictogramElement();
        if (pe != null) {
            Object bo = Graphiti.getLinkService()
                 .getBusinessObjectForLinkedPictogramElement(pe);
            // the filter assured, that it is a EClass
            if (bo == null)
                return;
            String name = ((EClass) bo).getName();
            nameText.setText(name == null ? "" : name);
        }
    }
}

 

Test: Verify the Property Sheet for the EClass

Now start the editor and create a new EClass. Open the properties view and select the EClass.

Verify that the property sheet tab “Main” is shown, and that the class name is correctly displayed.

There is currently no synchronization between the graphical editor and the property sheet. If the name of the EClass is changed in the editor, the change is not visible in the property sheet. The same happens vice versa.

The event handling can be implemented as an exercise.

Embedding a Standard Table Property Sheet

Eclipse also allows to embed a standard (table format) property sheet section into the tabbeb property sheet. This can be done by referencing a org.eclipse.ui.views.properties.tabbed.AdvancedPropertySection instead of the GFPropertySection-based section in the property section definition in plugin.xml. Addionally you will need to define an Eclipse adapter factory extension to map from the edit part selected in the diagram editor to an IPropertySource object defining what the properties are and how they shall be edited. An example how to embed such a property section is shown in the tutorial plugin. Have a look into the following extensions: