15 分鐘快速上手 Eclipse GMF：從模型到圖形化編輯器的完整指南

前言：為什麼選擇 GMF？

在 Eclipse 生態系中，Graphical Editor Framework (GEF) 早已是構建圖形化編輯器的標準框架。然而，直接使用 GEF 開發往往意味著要面對龐大的樣板代碼、複雜的 MVC 架構理解成本，以及模型與視圖手動綁定的繁瑣過程。雖然 GEF 的「模型無關」特性提供了極大的靈活性，但這也意味著開發者必須自行實現序列化、變更監聽等通用基礎設施。

Eclipse Modeling Framework (EMF) 的出現解決了模型層的序列化與通知機制，但將 EMF 模型無縫整合進 GEF 仍存在技術鴻溝（如命令堆疊不兼容）。Graphical Modeling Framework (GMF) 應運而生，它提供了一套「模型驅動」的生成式開發流程：定義領域模型、圖形定義、工具定義與映射定義，即可自動生成功能完整的圖形化編輯器，大幅降低了開發門檻。

核心流程概覽

GMF 的編輯器生成遵循「模型優先」原則，主要包含四大模型層：

1. 領域模型：基於 EMF 定義的業務數據結構（如 Shape、Connection、Diagram）。
2. 圖形定義模型：描述編輯器的視覺元素，包括 Figure Gallery、Node、Connection 等外觀屬性。
3. 工具定義模型：定義調色盤、選單、創建工具等交互界面元素。
4. 映射定義模型：將領域模型元素映射至視覺元素與工具，建立業務邏輯與圖形表現的綁定關係。

步驟一：定義 EMF 領域模型

本教程以簡單的圖形建模為例，模型包含 Shape（抽象基類）、RectangularShape/EllipticalShape（具體節點）、Connection（連線）與 ShapesDiagram（圖表容器）。使用 EMF 注解式 Java 定義模型介面：

// Shape.java
/** @model abstract="true" */
public interface Shape {
  /** @model */ String getName();
  /** @model type="...Connection" containment="true" */ List getSourceConnections();
  /** @model type="...Connection" */ List getTargetConnections();
}

// ShapesDiagram.java
/** @model */
public interface ShapesDiagram {
  /** @model type="...Shape" containment="true" */ List getShapes();
}

// RectangularShape.java / EllipticalShape.java
/** @model */ public interface RectangularShape extends Shape {}
/** @model */ public interface EllipticalShape extends Shape {}

// Connection.java
/** @model */
public interface Connection {
  /** @model */ Shape getSource();
  /** @model */ Shape getTarget();
}

完成介面定義後，通過 File → New → Eclipse Modeling Framework → EMF Model 創建 .genmodel，並勾選生成 Model 與 Edit 代碼。

步驟二：啟動 GMF 儀表板創建三大定義模型

打開 Window → Show View → Other → GMF Dashboard，依次創建：

1. 圖形定義模型

• 選擇 Canvas 作為根模型對象。
• 在 Figure Gallery 中定義矩形、橢圓等基礎圖元。
• 創建對應的 Node（矩形節點、橢圓節點）並綁定圖元。
• 定義 Connection 視覺樣式。

2. 工具定義模型

• 創建一個 Palette（調色盤）。
• 添加 Creation Tool 分別對應矩形、橢圓、連線創建動作。

3. 映射定義模型

使用向導 File → New → Graphical Modeling Framework → Guide GMFMap Creation：

1. 選擇領域模型、圖形定義、工具定義三個模型文件。
2. 指定圖表根元素為 ShapesDiagram。
3. 向導自動推導映射關係（節點↔Shape 子類、連線↔Connection、工具↔創建操作）。

步驟三：生成並運行圖形化編輯器

1. 在映射文件右鍵選擇 Create generator model... 生成 .gmfgen 文件。
2. 在 .gmfgen 右鍵選擇 Generate Diagram Code，將生成完整編輯器插件項目。
3. 啟動新的 Eclipse Runtime Workbench，通過 File → New → Examples → Model Diagram 創建圖表文件。

進階客製化與驗證機制

GMFGen 模型微調：生成的 .gmfgen 可通過屬性視圖調整命名規範、啟用列印支援、配置樣式等細節。

內建驗證框架：GMF 整合 EMF Validation（支援 Java 與 OCL），可實現：

• 連線數量限制（如每個節點僅允許一條輸出連線）
• 類型相容性檢查（僅允許同類節點相連）
• 屬性值約束（名稱格式、長度驗證）

驗證失敗時會在編輯器中顯示錯誤標記，體驗類似 Java 編譯錯誤提示。

總結

GMF 將圖形化編輯器開發從「手工編碼」轉型為「模型驅動生成」，配合 EMF 強大的模型基礎設施，讓開發者能在 15 分鐘內從零構建出功能完備的圖形化建模工具。對於需要快速原型驗證、領域特定建模語言（DSL）落地的場景，GMF 是 Eclipse 生態中不可或缺的利器。