
1 Silverlight的基础知识
作为一项全新的技术,Silverlight具有很多新的特性,但是作为Web开发技术的一项延续,Silverlight同时还需要很多老的知识。
1.1 从Rich Interface Application(RIA)说起
说起Silverlight,我们就不得不先说说著名的RIA概念,应该说RIA已经成为了现在应用程序的一种标准,如果现在开发的应用程序不支持RIA,那恐怕都不能算是新应用程序了。如此说来,那什么才算是RIA呢?我想就这一点回顾一下应用程序的开发历史。
在PC的“古代”也就是DOS时代,我们的操作系统只有黑纸白字的显示界面,所有的应用程序也只有最简单的菜单,这些菜单还是用一些技术画上去的。当然那时候绘制一个图形的方法还是有很多的,比如用printf直接在屏幕上输出一个文字或者用绘图函数(抱歉,年代久远,我已经不记得h文件的名称了)在屏幕上绘制一个“漂亮”的菜单界面,不过那个时候因为一般的计算机显卡只支持VGA和SVGA以及EGA这些模式,通常我们的应用也就只能使用16色作为显示模式。当时能做一个256色、640*480的应用程序就可以做一个好看的游戏了(著名的《仙剑奇侠传》就是这样的分辨率)。一般应用程序的界面毫无美感可言,冰冷的计算机和闪动的字符成了计算机行业的一个代名词,这种形象使计算机的开发者长久以来都带上了一个冰冷的面具,让人感觉这些人不进人间烟火。感谢Bill Gates在后来提出了Windows,这个产品给冷冰冰的应用程序提供了一个活泼欢快的界面,使应用程序从此变得面貌一新。我们说好产品也要有好包装,有了漂亮界面的应用程序从此开始变得更易亲近,PC由此开始普及。随着网络技术的发展,单机应用程序已经不能满足广大计算机用户日新月异的要求,为此一种新的基于网络的应用模式B/S架构诞生了,从B/S诞生的时候起很多现在我们耳熟能详的技术就逐渐跃上了舞台。在这里,我就不一一赘述了,总之基于HTML、CSS、IMG网络应用程序的界面已经从漂亮变为华丽,这虽然是技术上的一小步,但却是应用程序界面历史上的一大步,因为从此以后,应用程序的界面就从原来的功能描述性向华丽炫耀型转变了。
在Web应用程序进行得如火如荼的时候,C/S模式的应用程序也没坐以待毙,微软基于.NET平台提出了自己的分布式解决方案,使用一个本地的XML格式的小型关系数据库在本地缓存数据,在联网的时候再进行数据同步,这种被称为SmartClient的技术很快风靡了起来,很多用户都认为这是窄带的终极使用模式。与此同时,设计工具厂商Macro Media公司也开始基于自己的图形设计技术Flash以及其支持的脚本语言ActionScript大作声势,打算一举摘掉设计公司的帽子,戴上软件开发工具制造商的新桂冠。很无奈的是,由于ActionScript先天不足,虽然Flash在界面设计上确实有一定优势,然而依然无法满足应用程序的需要,所以这一技术现在应用也不广泛,而Macro Media也不得不卖给设计业巨头Adobe。作者当年也对这个技术颇为关心,而且一心一意希望Macro Media卖给微软,成为微软的应用程序设计工具,因为这样一来才算是取长补短,可惜事与愿违啊。此时微软也认识到了其应用程序在表现力上的不足,于是在.NET 3.0里推出了专门用于应用程序界面设计的WPF产品。什么是WPF呢?
就这个问题我们采访一下万智万能的“维基”大神。大神说道“The Windows Presentation Foundation(or WPF),formerly code named Avalon,is the graphical subsystem feature of the .NET Framework 3.0(formerly called WinFX)[在最终发布版本当中这一产品进行了很大的修改] and is directly related to XAML.[这是基于开放式标准扩展语言XML的一种扩展标记语言,使用语法严格的标记语言进行语义的描述,这些描述可以被浏览器直接解析,且由于这种语言本身语法严格,很容易成为记述数据库的标准,并即将成为未来数据应用和现实应用的基础。本章1.4节我们将介绍这一语言的若干细节] It is pre-installed in Windows Vista,[这是微软下一代操作系统具有优秀用户体验的界面] the latest version of the Microsoft Windows operating system. WPF is also available for installation on Windows XP SP2 and Windows Server 2003. It provides a consistent programming model for building applications and provides a clear separation between the UI and the business logic. A WPF application can be deployed on the desktop or hosted in a web browser. It also enables rich control,design,and development of the visual aspects of Windows programs. It aims to unify a host of application services: user interface,2D and 3D drawing,fixed and adaptive documents,advanced typography,vector graphics,raster graphics,animation,data binding,audio and video.
大神的意思是WPF这个东西啊,它是微软的窗口呈现架构(这里说说翻译的技巧,好的翻译是不但能呈现文字本身的含义,还能体现出文字本身意义之外的感觉,比如把萨达姆·侯赛因翻译成“沙坦·胡茄”,一下子就把萨达姆同学所在的环境给带出来了。这种翻译可算上佳,而把贝克汉姆同学翻译成“碧闲”就有点莫名其妙),原名叫做Avalon(这是凯尔特族传说中天堂中的岛屿,但不知是世外桃源还是人犯的流放基地),这一产品使用XAML记录图形的设计与显示模式,可以用于漂亮的UI设计、2D/3D图形绘制、文本与文档绘制,以及动画、音频、视频内容和数据绑定。看看,这是一个多么强大的产品。关于WPF的更多信息,请参见http://msdn2.microsoft.com/en-us/netframework/aa663321.aspx,以及王少葵的《深入解析WPF编程》一书。
这个产品很好地为应用程序进一步改头换面,此后应用程序就由应用变成“游戏”了。不过在Web应用上,Flash技术还是凭借其早期优势占据这几乎垄断的地位,其他的动态媒体技术,比如JavaApplet、纯JS绘制等都根本无法与其“叫板”,为此有人戏称,虽然Macro Media被Adobe收购了,但是在浏览器上的应用领域,还是Macro Media收购了IE、FireFox、Opera。而且Flash没有后台处理的能力,只能通过调用WebService来实现,现在多数应用调用的还是.NET写的WebService,这种情况犹如你在公司有个同事,每次干活都是你们俩一起,但是表功的时候都是他冲在
前面,于是表扬啊、奖励啊纷纷落到他的头上,真是“是可忍,孰不可忍”,于是微软开发了自己的基于Web的表示层技术,这就是基于WPF的Web轻量级应用Silverlight。那么什么又是Silverlight呢?
“维基(WiKi百科)”大神说道“Microsoft Silverlight is a web-based subset of WPF. During development it was named WPF/E,which stood for "Windows Presentation Foundation/Everywhere". The Silverlight subset enables Flash-like web and mobile applications with the same code as Windows .NET applications. 3D features are not supported,but XPS,and vector-based drawing are included.”请注意上面这段话,首先它说明了Silverlight是微软WPF的系列产品之一,系出名门啊;其次,它说明了这个产品原来叫做Windows Presentation Foundation/Everywhere,注意这个Everywhere,意思就是说“哪都成”,“哪都成”可是这句的焦点,也是微软.NET平台发展了这么多年最为人诟病的地方,总有人说微软的.NET是微软给自己开发的工具,是为了微软一统操作系统平台,号令硬件软件厂商提供方便的坏主意。应该说,这么讲也有一定道理,否则为什么至今我们没有看到.NET的跨平台应用呢。但是,微软这次居然提出了Everywhere来,难道不是说微软打算开始让.NET跨平台吗?您还别说,微软还就是这个意思,请看微软自己的说法“Silverlight is a cross-platform,cross-browser XAML-based WPF technology that provides features such as video,vector graphics,and animations to multiple operating systems including Windows Vista,Windows XP,and Mac OS X. Specifically,it is currently provided as an add-on for Mozilla Firefox,Internet Explorer 6 and above,and Apple Safari. Silverlight and WPF only share the XAML presentation layer.These extensions allow browsers to use Silverlight's graphics capabilities. The browser extensions are similar to Adobe Flash,a highly popular graphic plug-in available for most browsers. Internet Explorer has additional native support for WPF through the use of XBAP,available in Windows Vista and Windows XP with the .NET Framework version 3.0 installed. Silverlight is supported in older versions of the browser.Silverlight works in concert with XAML and is scriptable with JScript. Version 1.1 will also contain a version of the Common Language Runtime so it can execute VB.Net and C# code in a sandbox with limited local file access.”注意这里不但说到了跨平台,还指名道姓地说出了跨的是哪个平台,又有哪个平台可以被访问,这就不在是泛泛的忽悠,而是货真价实的东西了。不过说起来也不太难理解,Silverlight分为表示层和后置逻辑代码两个部分,表示层的应用统统基于对XAML的解析与分析,而后置逻辑代码专门用于处理各种业务逻辑。这个XAML的解析与分析,十有八九是分析成一种浏览器能解析的东东吧,这东东是什么呢,我并没有从官方文档看到说明,不过我分析十有八九是CSS+HTML一类的东西吧,因为这两个东西都是有国际标准的,不论是IE还是FireFox,在解析这个基于W3C(国际Web标准组织)的标准时,还是非常一致的(这里只是泛泛地说,因为实际情况是,很多时候浏览器在解析同样的内容时,还是有很多不同的方法的。这也就是为什么大的网站总要针对不同浏览器开发不同的版本)。前台解析技术就是在客户端提供一个把XAML翻译成CSS+HTML的东东,如果你对DOM或者SAX有研究也可以自己写一个基于JS的XAML解析器,把XAML翻译成你觉得好的东西,不过这些就不是本书讨论范围了。至于后台逻辑,在已经发布的Silverlight中是基于JavaScript的,这样的话,我想任何浏览器都可以对其进行解析了。当然,可能有人会说要是这样的话,那现在即将发布的1.1或者说叫2的东西是使用C#或者VB.NET解析的,难道是把这两种语言也翻译成JS,答案肯定是否定的,到那个时候,微软肯定会提供一个专门的安装包作为运行时进行下载。请大家不要着急,而且一旦这种运行时技术成熟,我想.NET的真正跨平台应用也就指日可待了。
下面说说Silverlight的结构。
Silverlight的结构如图1-1所示。

图1-1 Silverlight的结构(此图来自MSDN)
按图索骥,我们可以知道Silverlight是什么结构,应该说,这个结构图很好地说明了一些问题,让我们从上往下看。最上面一层叫做“User touch points”,这是什么呢?其实就是我们日常可以看到的那些应用程序界面。请注意这里面的特点,除去我们早就习以为常的Windows应用Web应用以外还有3种其他的应用,可能有人会问,其他的3种应用都是怎么回事呢?说起这点来我们不得不稍微称赞一下微软公司了。话说27年前,有个哈佛大学的辍学生说“I have a dream,I hava a dream today……”错了错了,不好意思,这是伟大的马丁路德金说的,不过话说回来大门同志的理想跟路德金比起来也丝毫不逊色。1979年,微软公司刚刚建立的时候,Bill Gates就提出了“A computer on every desk and in every home”这一伟大理想,虽然现在看来微不足道,但是在PC还只是大学实验室的高级设备的年代,简直是遥不可及的。(感谢微软,感谢Intel,感谢一切在这个技术进步运动中不断做出贡献,挑战人类智慧与激情之极限的人们,正是由于他们的不懈努力,才有了今天这样普及的PC,才有了这么多软件开发人员,才有了我今天这本书,他们真是我的衣食父母啊,谢谢他们。不过其实,话说回来,各位读者大大才是我的衣食父母,所以我会在书里一定做到知无不言,言无不尽,好好报答各位读者。)这是1977年到1999年微软的目标,微软无疑已经做到了。1999年,微软的目标变为“Empowering people through great software-any time,any place and any device”。怎么样,看到这里理解了上面为什么会有Office、Device和Digital Home了吧,这里强调的正是这个“任何”,因为只有这样,你才能随时随地使用软件产品来完成梦想,帮助你解决实际问题。经过多年的努力,确切地说是时至今日,微软已经在移动应用、家庭计算机娱乐这两个项目中实现了“any device”这个梦想。现在Windows Mobile的市场占有率已经节节攀升,而Xbox 360更是成为了家庭游戏机老牌劲旅Sony的劲敌。在应用软件平台方面,微软通过将Office 2007和微软原有的门户平台SharePoint Portal Server进行整合,可以让用户方便地在Office组件当中实现工作流程管理、日程管理、文档共享、公文审批等功能。Office作为企业门户的辅助客户端,基本上可以完成所有的日常办公工作,而基于Exchange 2007 Server,和Live Communicate整合以后,基于VOIP可以实现企业内部统一的信息管理平台UC。以上的几个技术都是微软的整合技术荟萃,应该说这些技术都很好地体现了任何软件在任何时间这个概念。当然一个完整的Digital Home目前还没有普及,不过大家要是有兴趣可以去美国华盛顿特区雷蒙德市看看Bill Gates的家,他家已经有一个这样的Digital Home在住了。虽然现在这只是世界第一有钱人才能住的豪宅,不过常言到“旧时王榭堂前燕,飞入寻常百姓家”,说不准哪天咱们家也能成这样了。这里顺便说一下,到2002年微软觉得这个目标也快要实现了,于是提出了一个更远大的目标,那就是“To enable people and business throughout the world realize their full potential”,帮助全世界的个人和企业充分发挥他们的最大潜力。这个目标的伟大程度足以赶上很牛的宗教了,至于微软将如何做到这一点,以及微软能否做到,我想引用南斯拉夫民族英雄瓦尔特先生的一句话“谁活着就能看得见。”让我们拭目以待吧。
第二层叫做Experience,我们称之为用户体验层吧,这层的内容比较好理解,就是为用户提供好的用户体验。说到这里可能又有人问了,什么叫好的用户体验呢?关于这一点,我想用一个字概括一下,那就是“爽”,我理解,这里面有3个层次,那就是从能用到好用再到喜欢用。什么程序是能用的呢?简单地说,就是把功能实现就算完,如果你还是不能体会,那就去大学里找个同学们做的软件工程课程设计,一般都是学生信息管理系统、图书馆管理系统一类试试看,如果这个设计通过了老师的评测,给了一个及格,那就算是能用,不过话说回来,曾几何时我们把计算机中的能用已经当成了一种标准,因为用计算机本身就是一种特牛的人才能干的事,所以界面不友好,功能复杂,早就成了习以为常了。这时候的计算机应用程序就像垄断行业的服务人员,跟他们打交道总得战战兢兢的,因为随时都可能给你来个“CrashDown”。后来日新月异了,市场开放了,经济搞活了,垄断被打破了,也没有大锅饭了,应用程序由能用变成了好用,因为不好用就没用户了,没用户就没饭碗,面对生存压力,应用程序开发商也纷纷低下了高贵的头颅,开始开发一些界面友好、简单易用的产品。在这个方面微软的Windows产品无疑具有划时代的意义。坦白讲,做软件能做到好用这个状态,那就已经相当不错了,要是你毕业设计做出一个好用的软件,那么老师肯定给你一个90,顺便论文申优,毕业的时候优先推荐工作。你在简历里写上,我当年做出过某某好用的软件,大家可以去某某地点下载,大家一看真的是好用的软件啊,肯定花大价钱请你,就业的问题也迎刃而解了。(以上内容倒也不是说笑,实在是有感于现在很多软件公司做的软件太技术化,完全不体谅用户。)以上是好用的程序,但是光有好用是不是够了呢?应该说,如果您是做工业控制、自动化办公平台、特种设备管理这些软件的话,能做到好用,也就是让不太具备计算机知识,但是具备行业知识的人能马上上手,那就相当不容易了。对喜欢用这个境界,可以听之任之不用过度关心它,但是如果您刚好从事的是一些竞争比较激烈的行业,而这个行业的受众又是“广大人民群众”,那您就不得不下一番心思去追求“喜欢用”这个境界了。其实“喜欢用”这个境界倒是也没多难,关键是亮点,第一要好看,第二要好玩。举个例子,都是在线听音乐网站,有的网站用网页内嵌ActiveX技术来实现,界面上就有个进度条,而其他的一概没有,灰突突的实在算不上好看,但是一点就能放歌,服务器质量好中途不会断,而且音质不错,那么这个音乐播放网站就算好用了,但是别人也可以很快做出一个一样的东西,所以要想在茫茫网站中取得一席之地或者说拔得头筹,那还得有点别的绝招。对于这点,百度给了我们一个很好的启示,请看图1-2和图1-3。

图1-2 百度老版音乐播放器
百度现在的新播放器使用了基于Silverlight技术的新界面,如图1-3所示。

图1-3 华丽的新界面
这种用户体验就非常不同了,类似的音乐网站还有http://www.yobo.com/,因为界面过于华丽,这里就不截图了,大家可以自己去查看。把界面做成这样,那就算好看了。
所以微软在这里提供了一个由浅入深的道路,首先是使用ASP.NET AJAX提供了诸多服务器端控件外加AJAX的无刷新提交,用户使用起来就已经很方便了。(关于AJAX的内容,可以参考微软的MSDN WebCast的相关课程。),在这个基础上,微软还顺便提供了Silverlight这种表示层的技术,来实现好看的界面,同时在Windows应用平台下,微软使用.NET Framework 3.0里的WPF技术给Windows应用也做了一个大改版,让Windows应用程序也变得“妩媚”起来,就凭这几种技术,微软让用户用起来感觉“爽”。
第三层是Presentation Modal,这一层就是上面那个“爽”的界面的底层业务逻辑实现,使用的分别是CSS+DHTML和XAML技术。这里面的DHTML是诸多技术的统称,我们认为“Dynamic HTML(简称DHTML、DHML)是一种通过结合HTML、用户端脚本语言(Client Side Script,如JavaScript)、关联样式表(CSS)和文件对象模型(DOM)来创建动态网页内容的方法。”(以上内容来源自维基百科)就这一层而言,XAML完全解决了界面描述功能的作用,这个想法本身就让人佩服。
最下面一层就是Programmer Modal了,这一层是所有层的基础,这个基础我们后面还要分开讲述,所以这里就不赘述了。