Flex应用简介.docVIP

Flex技术应用简介1 Flex简介1.1 RIA概述RIA是Rich Internet Applications的缩写，翻译成中文为丰富互联网应用程序。丰富互联网应用程序是将桌面应用程序的交互的用户体验与传统的Web应用的部署灵活性结合起来的网络应用程序。 RIA 是集桌面应用程序的最佳用户界面功能与Web应用程序的普遍采用和快速、低成本布署以及互动多媒体通信的实时快捷于一体的新一代网络应用程序。RIA中的 Rich Client（丰富客户端）提供可承载已编译客户端应用程序（以文件形式，用HTTP传递）的运行环境，客户端应用程序使用异步客户/服务器架构连接现有 的后端应用服务器，这是一种安全、可升级、具有良好适应性的新的面向服务模型，这种模型由采用的Web服务所驱动。结合了声音、视频和实时对话的综合通信 技术使RIA具有前所未有的网上用户体验。示例：gmail；QQ农场；（/node/1967）1.2 几种流行RIA技术介绍及比较1.2.1 AjaxAsynchronous Javascript and Xml（Ajax）是当前非常流行的Web开发技术，有很多成功的应用案例，比如Gmail、 Google Map和Backbase等。作为Rich Internet Application（RIA）的一种实现技术，Ajax不仅可以改善用户体验，还可以简化Web开发，通过将页面高度模块化，数据与表现分离，从而可以使服务器端和客户端都可以很好的解耦，降低开发的复杂度。 事实上，Ajax并不是什么新的技术，只不过是Javascript一些相对比较高级的特性的综合应用。也正因为此，Ajax与其它RIA实现技术（如Flash、Java Applet）相比，不需要在客户端安装特殊的插件，具有更广泛的浏览器兼容性。一般来说，Ajax所涉及的Javascript特性包括：1. 通过XMLHttpRequest的异步请求调用。 客户端Javascript可以通过异步的方式，向后端服务器发送请求、响应返回结果，对页面内容进行部分的更新，而不再需要每次由用户通过改变链接地址，对整个页面进行更新。这是Ajax能够实现页面的平滑刷新，提供用户体验的基础。 2. 对XML文档的解析与处理。由XMLHttpRequest返回的服务器端信息，可以是纯文本、HTML片段或者是XML文档。对于简单的Ajax应用，纯文本或者HTML片段即可完成任务（如 Gmail）；然而对于比较复杂的应用（如 Google Map），服务器返回的信息可能不仅包括页面更新的内容，还包括对页面进行控制的信息，这就需要使用结构化的XML数据，通过Javascript对XML进行解析和处理，获取必要的信息。 3. 基于prototype的面向对象的Javascript。从Ajax的字面意思上讲，这一特性并不是一个Ajax应用所必需的。然而，做为一种RIA，其相当大部分的业务逻辑是由客户端Javascript来实现的，如果使用传统的变量+函数的顺序执行的方式，其设计和实现都将是相当复杂的。而如果能够引入面向对象的思想，可以大大降低Ajax开发的复杂性。而Javascript的Prototype属性为这一实现提供了基础。 1.2.2 FlexAdobe Flex 是什么?像Flash一样，Flex创建一个可以用Flash播放器展现的Flash文件。 然而，Flex主要是开发者的工具，并且你开发Flex应用程序的方式完全不同于你开发Flash的RIA的方式。全部的Flex开发基于框架，该框架提供你可复用和可扩展性UI组件，数据和服务器的交互，事件处理等更多的功能。你可以在在你熟悉的代码环境创建RIA，而且你还可以从Flash应用程序得到很多益处，其中包括： 设计和实现人性化的用户接口的能力，并且这种接口不用考虑浏览器的限制问题 可以百分之百的部署到所有的网络用户的运行环境上 强大的ActionScript编程语言 和像流视频和声音的丰富媒体的集成的能力 相对比之下，Adobe Flash的环境关注于时间轴和可视化组件。因为重点，无论Flash编程语言AS的发展，是面向对象的语言，Flash因为创建灵活被作为设计者的开发工具。在过去的几年里，很多的开发者了解到用Flash创建强大RIA的简单，但是一部分人很难找一个合适的IDE。 你应该注意的是Flash和Flex可以一起工作。事实，Flex可以和Adobe的其他产品一起工作。设计者和开发者可以很轻松的在他们自己的去创建，然后整合成一个全新的RIA。 Flex定位于开发者，而不是设计者。主要的Flex开发语言，AS3，是一个面向对象的开发语言，所以你可以用面向对象编程的思想去实践。1.2.3 SilverlightSilverlight前身代号是“WPF/E”，作为微软最新面向Web开发的技术，“银光”吸引了无数开发人员以及设计人员的目光。这是微软推出的类似于Flash相同的解决方案，其利用了跨浏览器Web技术进行设计，以实现多操作系统，甚至是移动设备上的无缝运行。Silverlight是作为一个浏览器的插件，可以显示矢量图形、动画和视频。Silverlight集成了多种现有Web技术和设备，它可以在Windows、Mac平台上运行，支持IE、Firefox，甚至Apple的Safari Web浏览器。而无需对现有的网站设计进行移植，甚至包括利用Adobe Flash设计的内容。1.2.4 比较特性AjaxFlexSilverlight跨平台特性OKOKOK浏览器支持中好好装机率100%98%？展现效果中好好官方组件少多少开发语言JavascriptAction ScriptC#开发难度高中中2 Flex的技术特点2.1 丰富的界面效果支持图表、视频、声音、动画；控件丰富；2.2 可以和DOM交互创建Flash时初始化Flash；HTML调用Flash的方法；Flash调用HTML的javascript function。2.3 可以访问远程数据通过HttpClient；通过WebService；3 Flex的应用展示3.1 图表3.2 FusionChat3.3 摄像头3.4 文件上传4 开发实践4.1 环境Flex 3是Flex的一个成熟版本，它的产品集包含以下几部分。1. Adobe Flex 3 SDKFlex SDK是Flex产品集中最基础的也是必需的组件，使用其他组件必须在SDK的基础上，单独通过SDK就可以完成常用的程序设计。2. Adobe Flex Builder 3Flex Builder是一个基于Eclipse的集成开发环境，通过Flex Builder 可以对程序进行所见即所得的界面设计，并支持MXML和ActionScript的智能编写，可以在很大程度上提高Flex开发的效率。3. Adobe LiveCycle Enterprise SuiteLiveCycle ES是Flex企业级开发部署套件，以应用于企业级组件，使得Flex可以部署到JavaEE应用服务器上。4.2 开发示例Hello，Flex！示例代码：!CDATAimport mx.rpc.soap.mxml.WebService;import mx.rpc.events.FaultEvent;import mx.rpc.events.ResultEvent;import mx.controls.Alert;import mx.collections.ArrayCollection;Bindable private var dataSource:ArrayCollection = new ArrayCollection( Month: 一月, Sales: 135 , Month: 二月, Sales: 232 , Month: 三月, Sales: 235 , Month: 四月, Sales: 132 , Month: 五月, Sales: 235 , Month: 六月, Sales: 332 , Month: 七月, Sales: 435 , Month: 八月, Sales: 132 , Month: 九月, Sales: 235 , Month: 十月, Sales: 332 , Month: 十一月, Sales: 435 , Month: 十二月, Sales: 232 ); private function btn2009_click():voidgetSalesData(2009);private function getSalesData(year:String):voidvar service:WebService = new WebService(); service.loadWSDL(http:/localhost:3567/Service1.asmx?WSDL); service.addEventListener(ResultEvent.RESULT,onQueryResult); service.addEventListener(FaultEvent.FAULT,onQueryFault); service.GetSa