【MPS】Jetbrains MPS入門案例Shapes（三）

上一篇文章介紹了MPS入門案例中創建Editor的過程，這篇文章將介紹如何定義類似Java中枚舉類型的顏色值，定義這種類型可以使用戶在創建Shape實例時按照提示選擇限定的一些顏色值，而不會誤輸入其他不合法的值，在該案例中之定義了black、blue、cyan、green、red、white、yellow這幾種顏色，也就是說除了這幾種顏色之外用戶不可以定義其他值，比如gray等，自然也不會輸入其他的值，比如一個字符串"string"等。

創建Concept : Color

首先我們創建一個名爲Color的Concept，它的屬性只有name，因此只需要實現INamedConcept，並且要定義它的instance can be root項值爲true（這裏可能讀者會有疑問，Color不應該是包含在形狀裏的屬性嗎，爲什麼因爲可以作爲根元素？這是因爲在後面我們需要單獨定義顏色值，此時Color就作爲根元素，具體請看下方定義Accessory Model的部分）：

創建Color的Editor

然後再來定義一下Color的Editor，也就是表示Color的語法，layout裏依次包含以下兩個內容：

• 常量：Color
• 屬性值：name，敲下Ctrl + Space選擇{ name }

創建Accessory Model

定義完Editor之後Rebuild一下項目。此時我們可以定義限定的幾個顏色值了，首先在Language模塊的根目錄Shapes下右鍵選擇選擇Accessory Model（accessory以爲附件、配件，因此可以理解爲定義固定的幾個顏色配件），然後在彈出框填好如下方第二張截圖的內容：

此時多出一個accessories目錄，選中下面的Shapes.colors選項，按ALT + Enter進行Used Languages的導入（作用是讓這個accessory模型能夠引用Shapes中的Color），導入之後先不要關閉當前小窗口，切換到Advanced選項卡，將Do Not Generate勾選上，如下方第二張截圖所示：


選中accessories並郵件選擇new → color，此時會出現Color的實例模型，可以看到是我們在定義Color的Editor時定義的佈局（語法），到這裏就能解釋爲什麼Color需要設置instance can be root爲true了，依次創建black、blue、cyan、green、red、white、yellow的顏色實例，如下方第二張截圖所示：

創建Concept : ColorReference

創建ColorReference的目的是讓Shape能夠通過ColorReference來引用Color中限定的顏色值，在references下定義一個target : Color[1]來引用顏色值：

創建ColorReference的Editor

創建ColorReference的Concept之後需要定義它的佈局（語法），只需要顯示target（Color類型）顏色值名稱即可，通過Ctrl + Space可以補全下圖內容：

在Shape中添加顏色

要讓Shape擁有顏色需要給Shape添加childrens屬性——color : ColorReference[1]

添加Shape中顏色的編輯器組件

由於Shape是抽象Concept，因此沒有給它定義Editor，但繼承自Shape的Circle和Square需要實例化Color屬性，因此需要在Shape中定義一個可以提供給Circle和Square的ColorReference編輯器，首先在Shape的編輯頁面下點擊編輯器左下角的加號圖標，選擇Editor → Editor Component，如下兩張截圖所示：


在新創建的Editor Component中定義佈局component cell layout，依次包含以下內容：

• 常量：color:
• 屬性值：% color %，這個屬性值會去引用ColorReference的佈局
  

修改Circle和Square的Editor

在爲Shape定義好Color及其編輯器之後，就可以在Circle和Square的編輯器中添加顏色的佈局，在原來的內容上追加父類中定義好的Editor Component即# ShapeColor #（通過Ctrl +Space提示補全）：

更新Shape模型實例

以上完成了定義顏色值得所有步驟，此時Rebuild一下項目，打開沙盒中打開MyDrawing實例可以看到新添加了一個顏色屬性，顏色值可以通過Ctrl + Space補全：

至此，Shape的Concept（元模型、抽象語法）和Editor（具體語法）的定義就結束了，接下來我們需要定義Generator，也就是生成Java代碼，調用Java的圖形化編程庫來生成圖像，在DSL屬於上可以成爲生成執行語義。