Direct editing means the possibility to change values directly in the graphical editor. Technically the user clicks on a pictogram-element and an editor is shown, where the user can change the values of this pictogram element.
A typical use case is, that the user clicks on a text (either in a shape or a connection decorator) and then the text is overlaid with a text-edit-field, where the user can change the text value. To the user this actually looks as if the text is replaced with the text-edit-field.
Figure: Direct editing of a text
In this example we want to enable the users to edit the name of a EClass directly in the diagram. Therefore we have to create a direct editing feature and make it available in the feature provider.
A direct editing feature has to implement the interface IDirectEditingFeature. Instead of implementing it directly it should extend one of the available base classes. In this example we extend the base class AbstractDirectEditingFeature.
In this case we have to implement/overwrite several methods:
The method getEditingType has to return the editor type which shall be used to edit the value, in this example a text editor.
The method canDirectEdit has to check the given context and therefore it decides if direct editing is supported.
The method getInitialValue has to return the initial value with which the editor is initialized, which is usually the currently displayed value.
The method checkValueValid performs a check of the current editor value on each value change.
The method setValue has to set the edited value to the model at the end of the editing process.
You can see the complete implementation of the direct editing feature here:
package org.eclipse.graphiti.examples.tutorial.features;
public class TutorialDirectEditEClassFeature extends AbstractDirectEditingFeature {
public TutorialDirectEditEClassFeature(IFeatureProvider fp) { super(fp); }
public int getEditingType() { // there are several possible editor-types supported: // text-field, checkbox, color-chooser, combobox, ... return TYPE_TEXT; }
@Override public boolean canDirectEdit(IDirectEditingContext context) { PictogramElement pe = context.getPictogramElement(); Object bo = getBusinessObjectForPictogramElement(pe); GraphicsAlgorithm ga = context.getGraphicsAlgorithm(); // support direct editing, if it is a EClass, and the user clicked // directly on the text and not somewhere else in the rectangle if (bo instanceof EClass && ga instanceof Text) { return true; } // direct editing not supported in all other cases return false; }
public String getInitialValue(IDirectEditingContext context) { // return the current name of the EClass PictogramElement pe = context.getPictogramElement(); EClass eClass = (EClass) getBusinessObjectForPictogramElement(pe); return eClass.getName(); }
@Override public String checkValueValid(String value, IDirectEditingContext context) { if (value.length() < 1) return "Please enter any text as class name."; if (value.contains(" ")) return "Spaces are not allowed in class names."; if (value.contains("\n")) return "Line breakes are not allowed in class names.";
// null means, that the value is valid return null; }
public void setValue(String value, IDirectEditingContext context) { // set the new name for the MOF class PictogramElement pe = context.getPictogramElement(); EClass eClass = (EClass) getBusinessObjectForPictogramElement(pe); eClass.setName(value);
// Explicitly update the shape to display the new value in the diagram // Note, that this might not be necessary in future versions of Graphiti // (currently in discussion)
// we know, that pe is the Shape of the Text, so its container is the // main shape of the EClass updatePictogramElement(((Shape) pe).getContainer()); } }
|
Additionally the feature provider has to deliver our newly created feature (overwrite the method getDirectEditingFeature).
This implementation can be seen here:
@Override public IDirectEditingFeature getDirectEditingFeature( IDirectEditingContext context) { PictogramElement pe = context.getPictogramElement(); Object bo = getBusinessObjectForPictogramElement(pe); if (bo instanceof EClass) { return new TutorialDirectEditEClassFeature(this); } return super.getDirectEditingFeature(context); }
|
Now start the editor and test this new direct editing feature: