Example statechart editor with EuGENia

08Oct09

Here’s an example of what can be done with Emfatic and EuGENia. The following annotated Ecore metamodel can be used to create a nice Statechart graphical editor.

Here’s the emfatic source:

@namespace(
 uri="http://www.cs.toronto.edu",
 prefix="statechart")

package statechart;

@gmf.diagram(model.extension="sm", diagram.extension="smd")
class StateMachine{
 val State[*] states;
 val Transition[*] transitions;
}

abstract class State {
 ref NormalState[0..1]#submachine parentState;
}

@gmf.node(label="name", label.icon="false", figure="rounded", border.color="0,0,0")
class NormalState extends State{
 attr String[1] name;
 @gmf.compartment(collapsible="true")
 val State[*]#parentState submachine;
}

@gmf.node(label="name", label.icon="false", figure="ellipse", color="0,0,0", border.color="0,0,0", size="1,1")
class InitialState extends State{
 attr String[1] name="start";
}
@gmf.node(label="name", label.icon="false", figure="rectangle", color="0,0,0", border.color="0,0,0", size="1,1")
class FinalState extends State{
 attr String[1] name="end";
}

@gmf.link(label="name", source="start", target="end", target.decoration="arrow", color="0,0,0")
class Transition{
 attr String[1] name;
 ref State[1] start;
 ref State[1] end;
}

The diagram of the resulting Ecore model is (click to enlarge):

And once EuGENia has done its magic (instructions here), the resulting editor looks like this (again, click to enlarge):

Moreover, we can add EVL constraints to the metamodel and validate the resulting models according to them. This is a fairly simple example, but it goes a long way to demonstrate how easy it is to create things like this.

Filed under: diagrams, eclipse, fun, modeling   |  3 Comments
Tags: EMF, Epsilon, EuGENia, GMF, Statecharts