Eclipse GMFを利用した状態遷移図エディタの作成

グラフィカルなエディタをコーディングレスで作成する

チュートリアル（2/2）

マッピング定義

　GMFでは表示可能な形態として、次の4種類を定義しています。これは「Viewモデル」と呼ばれるもので、先ほど作成したドメインモデルとは異なるモデルになります。

Viewモデル

モデル名	説明
キャンバス（Canvas）	図を表現するモデル。ノードやリンクを包含することができる。
ノード（Node）	図に配置できる要素。区画を持つことができる
リンク（Link）	ノード同士をつなぐ線。
区画（Compartment）	ノードを分ける区画。子要素としてノードを持つことができる。

　マッピング定義とは、作成したドメインモデルが上記のViewモデルとどのように対応するかを定義することです。予想が付いていると思いますが、マッピング定義の作成にもGMFの便利なウィザードが提供されます。

各種定義ファイルの選択

　「statechart.ecore」を選択した状態で［New］-［Others］-［Graphical Modeling Framework］-［Guide GMFMap Creation］を選んでください。はじめに、モデル定義ファイル、グラフ定義ファイル、マッピング定義ファイルをそれぞれ選ぶことになりますが、あらかじめ「statechart.ecore」「statechart.gmfgraph」「statechart.gmftool」が入力された状態になりますので、それぞれ［Load］ボタンを押して次の画面に進めてください。

キャンバスの選択

　次に、キャンバスと対応するドメインモデルを選択します。ここではStateChartしか候補として挙がらないので、そのまま次の画面に進みます。

キャンバスの選択

ノードとリンクの選択

　次に、ドメインモデル中の何がノードと対応するか、何がリンクと対応するかを選択し、かつ、そのときに利用する見た目は何かの対応を設定します。ここでは「Stateがノードに対応する」という設定が行われるので、そのままウィザードを完了します。

ノードとリンクの選択

マッピング定義の修正

　グラフ定義、ツール定義では自動生成されたものに修正を加える必要はありませんでしたが、自動生成されたマッピング定義は不完全なので修正を加える必要があります。作成した「statechart.gmfmap」を開き、右クリックメニューから［Validation］を選択してください。すると、Label MappingのdiagramLabelが設定されていないという旨のエラーメッセージが表示されると思います。これは、Stateがノードであるとまでは推測できたのですが、Stateのname属性をどのように表示するのかが分からなかったためです。

　下の図のように、Diagram Labelを明示的に指定することで修正できます。

マッピング定義の修正

　修正した後に再びValidationを実施すると、今度はValidationに成功すると思います。

マッピング定義

<?xml version="1.0" encoding="UTF-8"?>
<gmfmap:Mapping xmi:version="2.0"
    xmlns:xmi="http://www.omg.org/XMI"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:gmfmap="http://www.eclipse.org/gmf/2005/mappings"
    xmlns:gmftool="http://www.eclipse.org/gmf/2005/ToolDefinition">
  <nodes>
    <containmentFeature
        href="statechart.ecore#//StateChart/state"/>
    <ownedChild>
      <!-- StateNodeとStateが対応する -->
      <domainMetaElement
          href="statechart.ecore#//State"/>
      <labelMappings>
        <!-- StateNameLabelとState#nameが対応する -->
        <diagramLabel
            href="statechart.gmfgraph#StateNameLabel"/>
        <features
            href="statechart.ecore#//State/name"/>
      </labelMappings>
      <tool
          xsi:type="gmftool:CreationTool"
          href="statechart.gmftool#//@palette/@tools.0/@tools.0"/>
      <diagramNode
          href="statechart.gmfgraph#StateNode"/>
    </ownedChild>
  </nodes>
  <diagram>
    <diagramCanvas
        href="statechart.gmfgraph#statechart"/>
    <domainModel
        href="statechart.ecore#/"/>
    <!-- 図全体を表現するモデルはStateChart -->
    <domainMetaElement
        href="statechart.ecore#//StateChart"/>
    <palette
        href="statechart.gmftool#//@palette"/>
  </diagram>
</gmfmap:Mapping>

ダイアグラムコード生成定義

　ダイアグラムコード生成定義はマッピング定義から完全に自動生成できます。「statechart.gmfmap」を選択して右クリックメニューから［Create generator model...］を選んでください。「statechart.gmfgen」ファイルが生成されます。

エディタ生成

　これで定義ファイル作りは完了です。「statechart.gmfgen」ファイルを右クリックして「Generate diagram code」でエディタが自動生成されます。

生成されたGMFエディタ

　チュートリアルでは、最も簡単なGMFを使ったエディタの作成方法について説明しました。参考文献や、添付したプロジェクトを見ていただければ、より高度なエディタの作り方についても学べると思います。

まとめ

　肝心のチュートリアルの部分が駆け足でしたが、GMFとはどういうものかというイメージを持っていただけたかと思います。実際の開発の現場に浸透していくのはまだまだ先だと思いますが、Visual UML Editorのように実際にGMFを利用したプロダクトも作成されてきています。

　今後エディタ作成の機会があったときに、選択肢の一つとしてご検討いただければ幸いです。

参考資料

　今回の記事の内容は「Graphical Modeling Framework Wiki」のチュートリアルの内容を簡単にしたものです。より詳細を知りたい方は、本家チュートリアルを参照してください。

1. Eclipse Graphical Modeling Framework
2. Eclipse Graphical Modeling Framework Wiki
3. W3C State Chart XML
4. Apache Jakarta Commons SCXML
5. Microsoft Tools for Domain Specific Languagesのチュートリアル
6. CodeZine 『EclipseとEMFを使用した簡易XMLエディタの作成』 志田隆弘 著、2005年6月、翔泳社