Visual Studio DSL 入門 6—DSL的圖形表示1

     到現在為止，我們還是只是介紹模型相關的東西，還沒有接觸到Dsl的模型的展現，對於一個Dsl來說，沒有圖形展現也是可行的，不過對於一個開發工具來說，要提供一種方式來操作我們的中繼資料,Visual Studio DSL在圖形展現這方面提供了不錯的支援，不過對於複雜的Dsl來說，圖形的展現往往需求很複雜，現在的圖形化支援在一定程度上也未必能夠滿足一些特定的需求, 有總比沒有好，期望微軟會在這方面會有所加強。 
    還是以我們建立的LanguageSm項目為例，我們大概介紹一下介面表示相關的概念,開啟DslDefinition.dsl檔案,這次我們看泳道(也就是樹線)的右邊:
  
   一. 圖表
       我們看最下面的LanguageSmDiagram,這就是圖表項目，它是儲存形狀和連接器映射的容器，代表設計介面自身，映射到模型的根域類(圖形元素Diagram Elements都是與模型相對應的),也就是映射到我們例子裡的ExampleModel,我們來看一表的屬性:
        
     在這裡，我們可以對圖表的外觀，代碼，文檔，公開樣式屬性，資源幾個方面進行屬性設定，Dsl會收集設定的這些資訊，然後根據T4模板，在Dsl項目的Generate Code檔案夾下面產生Diagram類，我們也可以對這個類進行擴充，實現圖表方面的一些自訂，比如設定背景圖，顯示網路等。如果你想實現Dsl模型的自己的介面表示方式，也需要實現自己的圖表項目Diagram類.

   二.編輯器
      編輯器分為兩種類型：(圖形)設計器和自訂編輯器.編輯器的定義在Dsl資源管理員(Dsl Explorer)中的“編輯器”(editor)節點下，這裡的定義的屬性用於產生EditorFactory類(熟悉VSX的應該知道，我們會在後面介紹)，工具箱等，我們來看一下預設的設計器的屬性:
     

     這裡需要提示一下，在dsl設計的過程中，有很多時候需要dsl瀏覽器和屬性對應操作使用，可以通過右鍵屬性來進行設定。
     屬性裡設定了編輯器對應的圖表項目，編輯器的GUID,根域類，以及儲存Dsl模型的副檔名，與檔案關聯的表徵圖。或許你不太明白這些屬性代表什麼意義，沒有關係，以後會明白的。
     我們在第一節就說過， Dsl模型並不一定要有圖形編輯器的，我們也可以在這裡添加我們自訂的編輯器，你可以右鍵刪除預設的Editor,然後在根結點LanguageSm上右鍵添加自訂編輯器，然後設定上面說的那些屬性，然後實現自己的DocView，在這裡有詳細流程，具體的方法我們也會在後面詳細介紹.
   

    三.形狀
     形狀是Dsl圖形符號的重點，因為形狀和模型元素一一對應(前面說的ExampleShape是一個幾何形狀,和根域類對應),可以使模型元素形象化，這也是Vs.Net DSL圖形化DSL的特點. 形狀又分為以下五個不同的類型,這五個形狀在工具箱上都有，可以直接拖動到繪圖區域建立對應的形狀,建議現在沒有必要太去細化，而只需要記住他們的樣式，能夠按需所有，具體怎麼設定還是到使用的時候再去研究:
     1.幾何形狀(GeometryShape)
          
        左側為形狀的模型，右側為調試後啟動並執行顯示模型，形狀中的文本裝飾器NameDecorator就是用來控制我們顯示圖形中的文本，你可以查看裝飾器的屬性，控制文本的顯示，包括文本,顯示位置等.

對於幾何形狀，除了文本裝飾器以外，你還可以添加IconDecorator（裝飾圖形上顯示表徵圖),ExpandCollapseDecorator(裝飾圖形的展開收縮)
     2.隔間形狀(CompartmentShape)
        隔間形狀是帶有隔間的幾何形狀，一個隔間形狀有可以有多個隔間:
       
       同樣，對於隔間形狀，你也可以象幾何形狀那樣添加其它的裝飾器.
     3.映像形狀(ImageShape)
        映像形狀是顯示圖形非輪廓的形狀:

        可以看到，映像形狀顯示的和我們普通的幾何形狀是不一樣的，我們可以針對圖象開關設定顯示的映像和表徵圖資源,我們來看一下上面的映像形狀的屬性,在最下面我們定義了顯示的表徵圖:
       
     4.連接埠(PortShape)
      連接埠是依附在形狀輪廓上，並只能繞輪廓移動的特殊形狀，除此之外，和普通的幾何形狀沒有區別。
        
     5.泳道(Swimlane)
      泳道用來將圖表分割成行或例，我們看下面的狀態流程圖:
     

參考資源
      1. Visual Stuido DSL 工具特定領域開發指南
      2.Using WPF As The Designer Surface In DSL Tools   Gokhan Altinoren

作者：孤獨俠客（似水流年）
出處：http://lonely7345.cnblogs.com/
本文著作權歸作者和部落格園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文串連，否則保留追究法律責任的權利。