silverlight与数据模型设计模式

silverlight与数据模型设计模式摘要本文主要从几个方面论述了silverlight与众不同的设计模式和从其中衍生的程序设计方法，也就是数据模型设计模式。

关键词设计模式；富用户体验；mvvm模式；数据模型设计模式；事件触发；面向对象；松耦合中图分类号tp31 文献标识码a 文章编号 1674-6708（2011）55-0172-03silverlight 是微软推出的新一代web前端应用程序解决方案，它使用第三方插件的形式，轻量级的植入到浏览器中，使用与flash 相似的机制实现富用户体验的互联网应用，并且提供硬件加速的支持，一级与flash相同的对流媒体的支持，因其与flash的相似性，也被称为flash杀手。

html 5的出现为web带来了冲击，它具有对于各种媒体的支持，具有canvas对象，也可以用于实现游戏，矢量图形等功能，然而开发成本较高，目前缺少成熟的开发工具的支持，因此在短时间内还不能取代flash和silverlight的地位。

并且，在微软最擅长的标准化，模块化，统一设计模式上，silverlight给我们带来了很多的启示和可以借鉴的地方。

silverlight是wcf的轻量级版本，使用xaml的方式来抽象出ui层，使之与逻辑层分离，类似于mvc设计模式，但又是对mvc的进一步优化。

xaml是基于xml的一种表达形式，它将图形，媒体，动画和部分触发器逻辑集成在xml文档格式中，并不涉及代码，并且推出了blend开发工具，用于很方便的简单拖拽，点击就可以实现丰富绚丽的动画。

微软的这种做法实际上是将设计者与程序员的工作进行了彻底的分离，使得二者可以并行工作，互不干扰，设计者做设计者的事，程序员做程序员的事，二者之间只要通过舞台中的变量名进行联系和操作即可。

并且它也因为开发工具blend的支持，极大的降低了开发成本，较html和js控制的页面逻辑有很大的进步。

又因为它是基于第三方的运行时环境(run time)，因此在任何机器和浏览器中都提供一致的表现，使得程序员不必再考虑兼容性问题，极大的降低了开发成本，缩短了开发周期。

它内置了linq作为数据查询语言，统一了数据的提取，并简化了数据库连接的方式，利用visual studio，通过简单拖拽就可以自动生成数据表结构对应的一系列类，可方便的通过.net framework 4.0提供的数据list泛型来获取数据，进一步简化和统一了开发过程。

silverlight程序的结构可以大致由以下的图形来表示。

图1表示了层次调用关系，silverlight的数据来源是基于wcf 网络服务的，由wcf作为数据提供者，通过http协议将所需的数据提供给silverlight应用程序，silverlight则控制如何将数据传送到xaml表示的展示层，wcf下层则通过linq与数据库进行交互。

这种架构实际上是一整套企业web解决方案。

由此而来的就是微软的mvvm设计模式。

微软在传统的model上又分出了一层model view，也就是数据视图层，并且从view层分出了一层view model，并且将controll 层省略去，实际上是将问题简单的划分为数据和展示两部分，但是其中数据与展示逻辑的接合部分由过去的controller变成了model view和view model。

如下图：如图2所示，可将程序架构大体划分为两块，展示层，和数据层，两边的工作都相对单纯和独立，展示层就负责把数据拿到之后怎样展示给用户，包括一系列动画，事件的响应等等，这些均是在客户端完成。

数据层则负责如何将数据通过linq，以不同的wcf service提供给前端，也就是怎样取数据，取哪些数据的问题。

这也就是model view的任务。

而如何将调用wcf方法获取到的数据展示到前端，通过xaml所提供的动画，图形，媒体等元素展现给用户就是view model的任务。

这样，就进一步实现了数据与展示的分离，而将controller的作用分成了两部分，model view和viewmodel，从而增加了前后端的并行性，使得问题可以以前后端对称的方式解决，不会弱化前端设计者所起的作用。

然而这在某种程度上也带来了问题，如果数据整理的工作没有分割明确，究竟是有前端去处理还是由后端去整理可能会成为前后端人员发生争议的地方。

那么，如何将获取到的数据通过前端的代码转化成可以给用户使用，或者说，可以友好的与用户进行交互的方式设计，并展现出来，便成了项目的重要的组成部分，用户体验的好坏，整体项目的成功与否，很大程度上决定于前端的实现。

本文作者在经过了反复的实践和总结后发明了一种新的设计模式：数据模型设计模式。

这种设计模式是受启发于微软的code behind技术，它通过将前端页面与代码分离，使得代码可以控制前端展现层的行为来讲问题划分为外在形式和内在逻辑两部分。

xaml所引以为豪的绚丽动画，媒体元素，矢量动画等，由设计师所做作的部分，可以看做后台code所使用，调用的工具，后台的code对于数据的处理，用户操作所作的判断，构成了程序的内在逻辑，这就是微软的code behind技术。

也就是说code behind实际上就是对view和view model的分离，然而它们原本所阐述的是同一个问题。

以人类比较容易理解的方式来说就是，将数据的放进装载并展现数据的容器中的过程，被分成了什么样的容器与怎样放，这两个问题。

实际上，以面向对象的设计思想来看，实际上这两个组成部分所得到的对象只有一个，那就是装载了数据的容器，因此完全可以把它抽象为一个独立的对象。

这就是数据模型设计模式。

该设计模式的基本原理如下图所示：以上3个过程揭示了数据模型(容器的初始化阶段)，数据模型在初始化之后，就可以与其他各个数据模型进行交互，包括数据的交互，包含关系，事件响应等等。

而事件响应则是通过微软的delegate对象，微软的事件都是通过委托来实现的，事件既然交由另外一个对象处理，那么就等于发出了一个委托，将如何对事件作出响应的过程委托给了其他对象。

并且事件对象也可以携带数据。

通过这种方式也就简化了实现的逻辑，更加便于人类理解并解决问题。

这种实现方式的唯一缺点就是，因为数据全部存储于展现层，存储于页面，如果数据量太大，有可能引起内存的紧张，导致程序运行缓慢，这时要通过有意识的优化代码，提高内存利用率，尽量避免将图像，视频的大量占用内存的对象始终存储于内存中。

而是只在需要的时候才载入。

这一切的实现都是基于一个事实，那就是silverlight对离线存储的支持，它已经不单纯是一个网页，而是一个可访问内存的应用程序，并且提供了比js更加强大的图形渲染能力。

从而为程序员开拓了开发绚丽复杂用户程序的可能性。

而普通的基于网页的网站，只能通过有限的方式访问session和cookie来解决部分问题，显然无法达到silverlight的效果。

因为silverlight的网络特性，在数据需要装载时往往需要访问网络资源，这时为了避免用户无止境的等待，需要异步的读取数据，这时就使用到了silverlight的webclient对象，它封装了一个对资源的请求从发出到结束的所有状态，可以在每个状态上加入侦听。

基于此接合前端动画的设计，可以制作出载入loading等异步反馈的对象。

该异步过程由以下几个部分组成：可以通过以上方式来实现进度条。

以下是对一个幼教系统的实现概述。

该系统分前后两端，前端需要能够展示教学素材和教案，教学素材由电影，音乐媒体，flash游戏，和文字材料组成。

后端负责教案的制作和教学素材的资源管理。

首先前端主要由以下功能部件组成：播放器。

翻页效果展示媒体资源的控件双端可出入的展示台控件。

可共选择电影集数的菜单。

载入资源时的loading控件。

各个页面均可看做由以上几个控件通过各种组合方式拼装在一起的整体。

那么使用数据模型设计模式来解决以上方案的方式如下：抽象出以上几个控件，并提供装载数据的接口，例如，播放器的数据接口为视频/音频文件的url，而播放器的播放停止快进，可拖拽的进度条等功能与所装载的媒体文件并没有关系，可以抽象出来单独实现，如此实现播放器控件。

翻页效果展示媒体资源的控件，数据接口为图片和泛型数据接口，也就是一个必须的用于翻页展示的图片和某一种可以灵活确定的泛型数据类型作为数据接口。

当接收到页面返回的该控件的鼠标点击事件，则将所携带的数据以带有参数的事件的形式触发出来，委托给上层对象处理，上层对象接到事件之后，例如事件参数为一个电影的url，那么就将该url通过播放器的数据接口对播放器进行装载，从而完成了从媒体资源控件到播放器的一次数据交互。

可见，采用数据模型设计模式使得框架清晰化，大大简化了程序的逻辑，并且提高了可复用性。

当多个页面需要使用播放器播放音频，或者其他资源时，或者需要使用媒体资源展示控件来用作其他用途时，就可以很方便的拿来使用。

这是数据模型设计模式结合了泛型与事件触发后，所达到的松耦合性所带来的好处。

以下，以一个页面的实现来解释该设计模式的运行机制：以下是界面功能图。

首先，翻页选择资源控件当接收到点击事件后，将对应点击对象所装载的资源介绍内容以事件的形式抛出，页面接到该事件后就将其所携带的信息装载入资源介绍控件，这时资源介绍控件就显示出了该资源的信息，点击播放就会进入第二个页面，播放器页面。

播放器页面收到资源介绍控件发出的对应资源的信息，其中包含了影片url地址，则对播放器控件进行数据载入，这时采取异步的载入方式，弹出loading对话框，显示载入进度，载入完毕后，进度条关闭，播放器已经可以对该url资源进行正常播放和控制了。

可见，数据模型设计模式所阐述的就是几个模型之间的关系，他们通过外在的页面环境来控制数据的流向，跳转和对应的动作，数据模型本身描述了客观世界所存在的数据与所依附的容器之间的关系，描述了数据的所在，容易被人类理解，也因此容易被实现和复用，没一个控件和模块都是可以单独拿出来使用的，他们之间的关联均是由事件驱动和接收事件的环境所决定的。

因此，这是一种最贴近实际生活的设计模式。

参考文献[1]chong-shan ran; ning li.design and implementation of communication model based on silverlight and wcf in eam system.information and financial engineering, 2010 2nd ieee international conference on digital object identifier.2010：590-593.[2]xiaochun zhou; chenlong shao.the design of virtual meeting system based on silverlight.artificial intelligence and education.2010 international conference on digital object identifier.2010：429-432.[3]li ping; ma li; cai changyu; zhu ling.research on application of ajax and silverlight technology in webgis. artificial intelligence and education.2010 international conference on digital object identifier.2009：2149-2152.。