Visual Studio DSL 入门 6---DSL的图形表示1

     到现在为止,我们还是只是介绍模型相关的东西,还没有接触到Dsl的模型的展现,对于一个Dsl来说,没有图形展现也是可行的,不过对于一个开发工具来说,要提供一种方式来操作我们的元数据,Visual Studio DSL在图形展现这方面提供了不错的支持,不过对于复杂的Dsl来说,图形的展现往往需求很复杂,现在的图形化支持在一定程度上也未必能够满足一些特定的需求, 有总比没有好,期望微软会在这方面会有所加强。 
    还是以我们创建的LanguageSm项目为例,我们大概介绍一下界面表示相关的概念,打开DslDefinition.dsl文件,这次我们看泳道(也就是树线)的右边:
   2010-2-9 22-39-46
   一. 图表
       我们看最下面的LanguageSmDiagram,这就是图表元素,它是存储形状和连接器映射的容器,代表设计界面自身,映射到模型的根域类(图形元素Diagram Elements都是与模型相对应的),也就是映射到我们例子里的ExampleModel,我们来看一下图表的属性:
       2010-2-10 0-12-07 
     在这里,我们可以对图表的外观,代码,文档,公开样式属性,资源几个方面进行属性设置,Dsl会收集设置的这些信息,然后根据T4模板,在Dsl项目的Generate Code文件夹下面生成Diagram类,我们也可以对这个类进行扩展,实现图表方面的一些自定义,比如设置背景图,显示网络等。如果你想实现Dsl模型的自己的界面表示方式,也需要实现自己的图表元素Diagram类.

   二.编辑器
      编辑器分为两种类型:(图形)设计器和自定义编辑器.编辑器的定义在Dsl资源管理器(Dsl Explorer)中的“编辑器”(editor)节点下,这里的定义的属性用于生成EditorFactory类(熟悉VSX的应该知道,我们会在后面介绍),工具箱等,我们来看一下默认的设计器的属性:
      2010-2-10 0-27-41

     这里需要提示一下,在dsl设计的过程中,有很多时候需要dsl浏览器和属性对应操作使用,可以通过右键属性来进行设置。
     属性里设置了编辑器对应的图表元素,编辑器的GUID,根域类,以及存储Dsl模型的文件扩展名,与文件关联的图标。或许你不太明白这些属性代表什么意义,没有关系,以后会明白的。
     我们在第一节就说过, Dsl模型并不一定要有图形编辑器的,我们也可以在这里添加我们自定义的编辑器,你可以右键删除默认的Editor,然后在根结点LanguageSm上右键添加自定义编辑器,然后设置上面说的那些属性,然后实现自己的DocView,在这里有详细流程,具体的方法我们也会在后面详细介绍.
   

    三.形状
     形状是Dsl图形符号的重点,因为形状和模型元素一一对应(前面说的ExampleShape是一个几何形状,和根域类对应),可以使模型元素形象化,这也是Vs.Net DSL图形化DSL的特点. 形状又分为以下五个不同的类型,这五个形状在工具箱上都有,可以直接拖动到图形区域创建对应的形状,建议现在没有必要太去细化,而只需要记住他们的样式,能够按需所有,具体怎么设置还是到使用的时候再去研究:
     1.几何形状(GeometryShape)
         2010-2-10 1-24-52 
        左侧为形状的模型,右侧为调试后运行的显示模型,形状中的文本装饰器NameDecorator就是用来控制我们显示图形中的文本,你可以查看装饰器的属性,控制文本的显示,包括文本,显示位置等.
2010-2-10 1-33-26
对于几何形状,除了文本装饰器以外,你还可以添加IconDecorator(装饰图形上显示图标),ExpandCollapseDecorator(装饰图形的展开收缩)
     2.隔间形状(CompartmentShape)
        隔间形状是带有隔间的几何形状,一个隔间形状有可以有多个隔间:
        2010-2-10 1-48-58
       同样,对于隔间形状,你也可以象几何形状那样添加其它的装饰器.
     3.图像形状(ImageShape)
        图像形状是显示图形非轮廓的形状:
2010-2-10 1-54-12
        可以看到,图像形状显示的和我们普通的几何形状是不一样的,我们可以针对图象开关设置显示的图像和图标资源,我们来看一下上面的图像形状的属性,在最下面我们定义了显示的图标:
        2010-2-10 2-01-08
     4.端口(PortShape)
      端口是依附在形状轮廓上,并只能绕轮廓移动的特殊形状,除此之外,和普通的几何形状没有区别。
      2010-2-10 2-10-18  
     5.泳道(Swimlane)
      泳道用来将图表分割成行或例,我们看下面的状态流程图:
      2010-2-10 2-05-02

参考资源
      1. Visual Stuido DSL 工具特定领域开发指南
      2.Using WPF As The Designer Surface In DSL Tools   Gokhan Altinoren

作者:孤独侠客似水流年
出处:http://lonely7345.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

 

posted @ 2010-02-10 02:19  孤独侠客  阅读(3689)  评论(5编辑  收藏  举报