《Flex学习文档》word版.doc

Flex学习文档一， 总体介绍传统网络程序的开发是基于页面的、服务器端数据传递的模式，把网络程序的表现层建立于HTML页面之上，而HTML是适合于文本的，传统的基于页面的系统已经渐渐不能满足网络浏览者的更高的、全方位的体验要求了。而富互联网应用（Rich Internet Applications，缩写为RIA）的出现就是为了解决这个问题。富互联网应用程序是下一代的将桌面应用程序的交互式用户体验与传统的WEB应用的部署灵活性和成本分析结合起来的网络应用程序。富互联网应用程序中的富客户技术通过提供可承载已编译客户端应用程序（以文件形式，用HTTP传递）的运行环境，客户端应用程序使用异步客户/服务器架构连接现有的后端应用服务器，这是一种安全、可升级、具有良好适应性的新的面向服务模型，这种模型由采用的WEB服务所驱动。结合了声音、视频和实时对话的综合通信技术，使富互联网应用程序（RIA）具有前所未有的网上用户体验。Adobe RIA技术封装让现有的WEB技术得到了极大的保留，核心价值在于大大提高了产品设计师和开发工程师的“开发体验”，强化了设计端和开发端的整合。设计师和开发工程师们可以方便地将自己的代码平移到新的平台上，并且发布、部署的方式比之前的任何一款开发工具都方便得多，从而使RIA应用有更广大的开发者基础。Adobe RIA技术也将带来新的桌面革命“Desktop 2.0”，内容从Flash, HTML/CSS/JS，到PDF，几乎涵盖了时下最流行的WEB内容载体。此外，“可离线”应用模式能让用户更加安全、舒适地进行工作和娱乐。用户们不必再抱怨因网络故障而造成的信息损失，而且也可以借助本地资源更好地节省网络资源。因此，Adobe RIA技术可以让用户将WEB 2.0应用带回桌面，创造的商业应用价值和用户体验价值将超过以往任何技术。 -摘自百度百科Flex 作为富 Internet 应用（RIA）时代的新技术代表，自从 2007 年 Adobe 公司将其开源以来，Flex 就以前所未有的速度在成长。很多公司，包括 IBM 都纷纷加入了 Flex 开发的阵营当中。很多开发人员也按捺不住 Flex 的“诱惑”而准备从事 Flex 开发。 -摘自http:/www.IBM.com/cn二， 开发Flex的必要工具1. 开发工具。Flex的开发工具是Flex Builder，目前常用版本是3.0，最新版的4.0已经在试运行阶段了。Flex Builder构建在Eclipse之上，eclipse是一个非常好的交互式开发环境（IDE），非常流行的Java开发工具。虽然开发Flex程序不一定要Flex Builder，但是Flex Builder提供了很多优秀特性可帮助你有效提高设计和开发效率，Flex Builder 可独立安装也可作为eclipse插件形式安装。2. FluorineFX。FluorineFX是一个开源库，提供了一种在.NET framework下对Flex/Flash的远程过程调用，Flex数据服务和实时数据的使用技术。主要特性有：Flex, Flash Remoting (RPC)Flex Messaging (partial)Flex Data Services (partial)Supports AMF0, AMF3 and RTMP protocolsService BrowserTemplate based code generator (ASP.NET like syntax)Easily integrate rich Internet applications with .NET backendEasily integrate with Adobe Integrated Runtime (Adobe AIR)3. Microsoft Visual Studio 2005/2008，开发服务端程序的工具。4. WEB浏览器和Flash Player9.0或者Flash Player10.0。用于加载程序。三， 两个重要的协议1. RMTP：Real Time Messaging Protocol（实时消息传送协议协议)实时消息传送协议是Adobe Systems公司为Flash播放器和服务器之间音频、视频和数据传输开发的私有协议，在Flex中的主要应用时ShareObject。 原始RTMP协议是维护了一个基于TCP唯一的长连接，允许实时通信。它有三种变种：1)工作在TCP之上的明文协议，使用端口1935； 2)RTMPT封装在HTTP请求之中，可穿越防火墙； 3)RTMPS类似RTMPT，但使用的是HTTPS连接； RTMP协议是被Flash用于对象,视频,音频的传输.该协议建立在TCP协议或者轮询HTTP协议之上. RTMP协议就像一个用来装数据包的容器,这些数据可以是AMF格式的数据,也可以是FLV中的视/音频数据.2. AMF：AMF(是Action Message Format的缩写)是在flash和flex中remoting的一种方式格式。在Flex中的主要应用是RemoteObject。AMF协议是基于Http协议的。它的内容处理过程大致是这样：1、从客户端获取Http请求(Request)流.2、对流进行解串行化(Deserialize)，得到服务器端程序能够识别的数据，并建立一个响应(Response)消息3、Debug开始4、对流进行各种处理(记录、许可、服务)得到返回值5、对响应流进行串行化6、发送Http响应给客户端四， 与HTML比较1. 文件大小（缺）。Flex文件比HTML文件大，据我实验，在同样空白的两个页面中各放入100个按钮，Flex生成的swf文件时274k，而HTML得到的页面大小是10k。因为Flex生成的是一个swf文件，它会将mxml代码和所有的icon文件和必需的程序文件都保存在此swf文件中；而HTML文件中只有html代码，而不包括其他代码和图片，其他代码会保存在一个DLL文件中。2. 开发效率（优）。两者的开发效率无疑是因人而异的，就小弟而言，Flex比HTML的开发效率略高。具体体现在，l 前台显示：主要差别在控件上，其中有：控件的多少、控件本身的功能和控件本身的样式等。l 后台数据处理：目前主要有三种HttpService、WebService和RemoteObject三种。Ajax和.net主要用的是HttpService来与IIS进行交互，而Flex可以用以上三种的任意一种。据Adobe公司称，RemoteObject的数据处理和传输的速度比前两者的都要快。各自的具体工作原理在下面会有详解。l 兼容性：HTML和JavaScript都要考虑兼容性问题，而flex则不需要考虑此问题。3. 运行效率（未知）。Flex生成的前台文件比较大，所以在初始化的下载方面运行效率肯定会低，而Flex使用RemoteObject的速度又比较快，所以具体两方面的优劣程度如何还未知，有待确认。4. 外观效果（优）。Flex自带控件的样式比HTML自带控件样式要美观。而且在自定义样式方面，flex同样支持css样式表的配置。5. 实时性（优）。flex有rmtp协议的支持，可以用shareObject对象来进行客户端与服务端的实时同步。而HTML要想实现与flex同样的效果必须由客户端实现定时器来实时向服务端发送请求来与服务端进行同步，这样实现的缺点是对服务器的压力和对网络的压力都很大。RTMP协议时6. 兼容性（优）。HTML中的脚本语言是JavaScript，HTML在IE的各个版本和其他浏览器之间都存在着各种兼容性问题，而且JavaScript也在其中存在兼容性问题。Flex中的脚本语言是ActionScript，目前没有在flash player的第九和第十版本之间发现有差异，而Flash player与web浏览器之间没有兼容性问题，如果有那也是Adobe和浏览器之间的问题，目前没有在常用的IE和火狐中发现问题。7. 运行环境（缺）。HTML的运行环境是web浏览器，而flex的运行环境则是web浏览器和FlashPlayer。如果没有安装FlashPlayer的浏览器是不能运行swf文件的。五， 新建项目。对于开发者来说第一件事就是如何创建一个Flex项目。Flex项目和其他项目有点不一样，因为它需要包含SWC (Flex库) Flex library SWC (不像ActionScript项目) 编译生成的可被Flash播放器执行的SWF文件(不像Flex Library项目)。1. 要想创建项目，在Flex Builder视图中点击工具栏中的File，在下拉菜单中选择 NewFlex Project，然后会弹出创建项目对话框。2. 在弹出的页面中设置图片中标注的红色部分后，点击Next按钮，项目名称项目保存路径项目类型：Web应用程序、桌面应用程序选择服务端的应用程序类型，我们可以选择A，如果选择None，则运行程序的时候会在资源管理器中打开，而不是以网站的形式打开3. 设置上一步中选择的Asp.Net的服务器的配置，设置完成后点击Validate Configuration，然后再点击Next即可，选择运行时候的打开方式：1利用.net自带的服务应用程序打开2利用IIS的虚拟目录打开选择Flex程序保存的路径，一般用默认的在IIS中虚拟目录的地址生成的swf文件的输出路径修改虚拟目录后的应用按钮4. 以上设置都不需要修改，最后点击完成即可。5. 点击完成后，会在导航栏（Flex Navigate）中存在一个flex项目，而且默认的mxml文件已经在编辑窗口打开，如下六， 设置版面布局。1. 切换到视图模式2. 从工具/元件栏（Components view）中拖一个“Label”控件到页面舞台中。3. 在属性窗口（Flex Properties）中l 在Common区域中找到Text属性，并修改内容为“这是第一个Flex程序”l 在Style区域中找到Text属性，并修改字体大小内容为21，并点击“B”l 在Layout区域中找到X，Y属性，并修改内容分别为100,1004. 再向页面中拖一个TextInput控件，并按照上面的配置进行设置。5. 切换到代码（Source）模式后，会在mxml代码中显示如下：6. 点击运行按钮，即可预览效果七， 绑定数据和事件1. 新建一个ArrayCollection变量，使用mxml新建一个Array标签，如下2. 为标签添加属性id，并赋值为roomList3. 为此Array添加子项，如下 room1 room2 room3 room44. 在视图状态下，为界面上拖放一个List控件，并在属性栏中为dataProvider属性赋值roomList，然后保存并运行，效果为5. 为list添加一个itemClick的委托并赋侦听事件为changeHandler(event)，代码如下：6. 新建侦听事件changeHandler(event)，所有函数代码都写在标签中，在添加Script标签时，在输入到第一个script标签的结束括号时，Flex Builder会将其余部分自动完成，接着在标签中添加一个名为changeHandler的函数7. 开始调试，点击在编辑器的右上方的open Perspective，并切换到Flex Debugging8. 在程序中添加一个断点，9. 保存并点击调试按钮10. 在预览的界面上点击list中的任一项，焦点会自动切换到Flex Builder中，并在Variable选项卡中可以看到roomList的值八， 通过httpservice Request为控件赋数据源1. 打开项目中的adobeODT.mxml，删除roomList的Array代码，并在script标签中添加如下代码：import mx.collections.ArrayCollection;2. 并定义一个类型为ArrayCollection的变量roomList，private var roomList: ArrayCollection;3. 并给roomList变量添加Bindable的数据标签，如Bindableprivate var roomList: ArrayCollection;4. 在script标签下添加httpservice标签，如5. 给Application标签添加一个系统委托，creationComplete，并赋值init();creationComplete=init()6. 在script标签下创建一个自定义函数init()，private function init():void7. 在init()函数中调用httpService的方法send()，rooms.send();8. 给httpservice添加执行成功和失败的回调函数，在httpservice标签中添加属性fault，并赋值为httpfaulthandle()，如：fault=httpFaultHandler(event)9. 并在script标签中引用FaultEvent类import mx.rpc.events.FaultEvent;10. 再引用Alert类import mx.controls.Alert;11. 在script标签中添加一个名为httpfaulthandle的函数，该函数有一个类型为FaultEvent的参数，且返回值为voidprivate function httpfaulthandle(event:FaultEvent):void12. 在此函数中添加一个方法为提示用户出错的信息，Alert.show(“报错了！”);13. 在没有roomList.xml的文件的时候，保存并运行14. 给HTTPService新建一个result的委托httpResultHandle ()result=” httpResultHandle ()”15. 在script标签中引用ResultEvent类，如：import mx.rpc.events.ResultEvent;16. 再在script标签中新建httpResultHandle函数，并在函数中添加函数执行成功的提示，如下：private functiuon httpResultHandle(event:ResultEvent):void Alert.Show(“恭喜，执行成功！”);17. 并在与adobeODT.mxml同级的目录下新建一个名为roomList的XML文件，文件内容如下：18. 保存并运行，19. 再在httpResultHandle函数中添加给roomList赋值的代码，private functiuon httpResultHandle(event:ResultEvent):void roomList = event.result.rooms.room; Alert.Show(“恭喜，执行成功！”);20. 保存并运行，这时我们在list控件可看到数据显示是Object Object，这说明我们没有指定List要绑定具体的字段，这时就需要指定labelField和dataField属性，我们从语义上就很容易地看出，前者是指定显示的字段，后者指定的是绑定的数据字段。接下来我们继续修改List控件如下 21. 保存并运行，九， 通过RemoteObject与服务端进行通信Flex与.net通信可以通过WebService、HTTPService、UrlLoader以及FileReference来进行通信，通过这些方式与服务器的通信是非常简单方便的，但他们的缺点是通信数据量较小，如要传输较大数据或是实现不同对象的序列化传输，它们则满足不了我们的需求，需要寻找另一种通信协议，另一种高效的传输协议来代替SOAP协议的传输方案，那便是AMF(ActionScript Message Format)协议。我们可以看以下的一个小测试结果： 开源项目FluorineFx就是专门针对.NET平台与Flex通信提供的AMF的协议网关，我们可以通过FluorineFx很方便地完成与.NET平台的通信。FluorineFx的下载地址是：/download.html，下载后安装。1. 新建一个.NET的解决方案，并添加FluorineFx服务器库2. FluorineFx服务库添加成功后会发现，项目模板中会自动为我们创建一个Sample类和Echo方法，如下3. 接着添加FluorineFx网站到解决方案，添加成功后网站会自动引用FluorineFx服务库的dll，如下图4. 到这里我们可以简单测试FluorineFx的.NET服务端是否成功创建，通过浏览器查看FluorineFx网站中的Console.aspx页面，程序便会运行到FluorineFx的控制台，展开左边项目中Service节点便会看到上面模板为我们创建的类和方法，点击方法节点，在页面的右边就可以进行测试了，如下图5. 到这里.NET服务端的开发就完成了。6. 在Flex Builder中点击工具栏中的ProjectPropertiesFlex Compiler中找到Additional compiler arguments，在对应的文本框中输入如下-locale en_US -services .WEB-INFflexservices-config.xml -context-root /A5Server，其中的红字和蓝字部分是根据项目不同来设置的，红字代表服务器端的FluorineFx网站下的WEB-INF文件夹中services-config.xml的相对位置，此处也支持绝对路径，如：C:/web/WEB-INF/services-config.xml，根据项目的需要进行设置。蓝字是FluorineFx网站的网站目录。7. services-config.xml文件的内容是指定协议和通道的，是系统自定义的，一般用默认的即可，内容代码如下：8. 接下来我们再到Flex Builder中新建一个名为roDemo的mxml页面，下面我们就用刚才创建的Sample类中的Echo方法来做测试，在页面的代码状态下新建一个RemoteObject对象，如： 这里注意的是：destination需要配置为与remoting-config.xml中的destination的id一致，source则配置为sample类的命名空间和类名称，通过标签中配置远程对象的方法和处理结束后的回调函数，下面我们就可以通过id来调用远程方法了，如：9. 保存并运行，10. 如果我们要从数据库中取出数据，则我们可以在.NET的项目中将数据取出，然后将对象直接传给Flex即可。具体过程请看示例。十， 通过ShareObject与服务端进行实时通信使用FluorineFx.Net开发的每一个实时通讯功能应用都拥有一个应用程序适配器（ApplicationAdapter），用来管理整个实时通讯应用的生命周期，以及接受和拒绝客户端的连接等。应用程序适配器对象也就相当于是一个Flash媒体服务器应用程序的对象。 使用FluorineFx.Net开发及时通信应用，我们可以通过ASP.NET网站来宿主，一个ASP.NET网站可以承载多个实时通讯应用程序。这些应用程序都存储ASP.NET网站的根目录下指定文件夹的根目录中。如下图示： 在开发FluorineFx的及时通信应用的时候，按照FluorineFx的目录结构配置ASP.NET的站点目录是非常简单的，只需要在ASP.NET站点下面建立一个名为apps的目录，那么FluorineFx就会认为此目录下的每一个文件夹就表示一个FluorineFx应用。1. 配置服务端程序，打开上面新建的FluorineFx网站的项目，在根目录下新建名为apps的文件夹，做为上图中应用程序的容器，再在apps下新建名为Rsho的文件夹，Rsho就是上图中应用程序的名称，提供给客户端的访问地址就是：rtmp:/localhost/Rsho。2. 定义RshoApplication类。在A5Server解决方案中添加一个名为A5Adapter的FluorineFx类项目，并定义RshoApplication类，内容为建立共享体“OnLineUsers”和接收客户端的连接请求，具体代码如下：3. 在新建的Rsho文件夹下新建一个配置文件app.config。内容如下application-handler的type就是定义服务端定义共享体的类RshoApplication的命名空间和类名称。4. 接下来在Flex Builder中新建RealData.mxml页面，并在其中建立连接NetConnection，并建立与服务器通信的方法，并制定在连接成功后的回调函数onStatusHandler（）如下：private var nc:NetConnection;private function connectionServer():void nc = new NetConnection(); nc.connect(rtmp:/localhost/Rsho,); nc.addEventListener(NetStatusEvent.NET_STATUS,onStatusHandler); nc.client = this;在此处有个问题，nc.connnect(rtmp:/localhost/Rsho,)中的Rsho是建立在FluorineFx网站的apps文件夹下的，但是一个服务器上的FluorineFx网站可能不止一个，如果不同的FluorineFx网站下面都有Rsho文件夹，那么此处的地址就不能明确表示该从哪个FluorineFx网站下去找共享体了，所以就一直提示连接服务器失败，根据这个问题我从网上找了很多资料，但是资料大都是在地址的服务器名后加了一个端口号，这个很好理解，在服务器上一个端口就可以对应一个网站，如果服务器名和端口号已知，那么对应的FluorineFx网站地址也就明确了。但是我想用默认的80端口，也就是地址上不带端口号。最后经过N次实验，先用RemoteObject对象先跟服务器进行一下连接，然后再通过NetConnection跟服务器去连，结果就可以连上了，呵呵，具体原因我也不知道是为什么，只是偶然试出来的，而且经过多次测试都可以成功。所以将以上的方法前添加一个RemoteObject的连接，当连接成功后再调用NetConnection连接，代码如下：private function conRemoteServer():void var con:RemoteObject = new RemoteObject(fluorine); con.source = A5Server.oLibrary.mainLibrary; con.Logon(); con.addEventListener(ResultEvent.RESULT,onResultRemote);private function onResultRemote(event:ResultEvent):void var pop:Boolean = event.result as Boolean; if(pop) connectionServer(); private var nc:NetConnection;private function connectionServer():void nc = new NetConnection(); nc.connect(rtmp:/localhost/Rsho,); nc.addEventListener(NetStatusEvent.NET_STATUS,onStatusHandler); nc.client = this;5. 再在页面定义一个类型为共享体ShareObject的变量so，新建onStatusHandler()函数，并在将指定服务器中的共享体“OnLineUsers ”赋值给so，并给共享体添加一个触发器函数，SyncEvent.SYNC表示触发器的委托，即当服务端的“OnLineUsers”共享体发生变化时，会回调这个委托下的函数，从而达到与服务器同步的效果。具体代码如下：6. 保存并运行，其中“直接连接服务器”按钮是不通过RemoteObject而直接用NetConnection去连服务器的方法；“Remote连接服务器”按钮是先通过RemoteObject去连服务器，再通过NetConnection连服务器。效果如下：十一， 其他资料推荐1. 官方网页 /2. Flex的控件功能介绍的网站：3. 百度网站 4. 另附：Flex中文帮助文档与Flex3 RIA 开发详解与精深实践5. 示例代码：A5Server6. 感谢网络分享者。2009-12-4Flex学习文档十二， 总体介绍传统网络程序的开发是基于页面的、服务器端数据传递的模式，把网络程序的表现层建立于HTML页面之上，而HTML是适合于文本的，传统的基于页面的系统已经渐渐不能满足网络浏览者的更高的、全方位的体验要求了。而富互联网应用（Rich Internet Applications，缩写为RIA）的出现就是为了解决这个问题。富互联网应用程序是下一代的将桌面应用程序的交互式用户体验与传统的WEB应用的部署灵活性和成本分析结合起来的网络应用程序。富互联网应用程序中的富客户技术通过提供可承载已编译客户端应用程序（以文件形式，用HTTP传递）的运行环境，客户端应用程序使用异步客户/服务器架构连接现有的后端应用服务器，这是一种安全、可升级、具有良好适应性的新的面向服务模型，这种模型由采用的WEB服务所驱动。结合了声音、视频和实时对话的综合通信技术，使富互联网应用程序（RIA）具有前所未有的网上用户体验。Adobe RIA技术封装让现有的WEB技术得到了极大的保留，核心价值在于大大提高了产品设计师和开发工程师的“开发体验”，强化了设计端和开发端的整合。设计师和开发工程师们可以方便地将自己的代码平移到新的平台上，并且发布、部署的方式比之前的任何一款开发工具都方便得多，从而使RIA应用有更广大的开发者基础。Adobe RIA技术也将带来新的桌面革命“Desktop 2.0”，内容从Flash, HTML/CSS/JS，到PDF，几乎涵盖了时下最流行的WEB内容载体。此外，“可离线”应用模式能让用户更加安全、舒适地进行工作和娱乐。用户们不必再抱怨因网络故障而造成的信息损失，而且也可以借助本地资源更好地节省网络资源。因此，Adobe RIA技术可以让用户将WEB 2.0应用带回桌面，创造的商业应用价值和用户体验价值将超过以往任何技术。 -摘自百度百科Flex 作为富 Internet 应用（RIA）时代的新技术代表，自从 2007 年 Adobe 公司将其开源以来，Flex 就以前所未有的速度在成长。很多公司，包括 IBM 都纷纷加入了 Flex 开发的阵营当中。很多开发人员也按捺不住 Flex 的“诱惑”而准备从事 Flex 开发。 -摘自http:/www.IBM.com/cn十三， 开发Flex的必要工具1. 开发工具。Flex的开发工具是Flex Builder，目前常用版本是3.0，最新版的4.0已经在试运行阶段了。Flex Builder构建在Eclipse之上，eclipse是一个非常好的交互式开发环境（IDE），非常流行的Java开发工具。虽然开发Flex程序不一定要Flex Builder，但是Flex Builder提供了很多优秀特性可帮助你有效提高设计和开发效率，Flex Builder 可独立安装也可作为eclipse插件形式安装。2. FluorineFX。FluorineFX是一个开源库，提供了一种在.NET framework下对Flex/Flash的远程过程调用，Flex数据服务和实时数据的使用技术。主要特性有：Flex, Flash Remoting (RPC)Flex Messaging (partial)Flex Data Services (partial)Supports AMF0, AMF3 and RTMP protocolsService BrowserTemplate based code generator (ASP.NET like syntax)Easily integrate rich Internet applications with .NET backendEasily integrate with Adobe Integrated Runtime (Adobe AIR)3. Microsoft Visual Studio 2005/2008，开发服务端程序的工具。4. WEB浏览器和Flash Player9.0或者Flash Player10.0。用于加载程序。十四， 两个重要的协议1. RMTP：Real Time Messaging Protocol（实时消息传送协议协议)实时消息传送协议是Adobe Systems公司为Flash播放器和服务器之间音频、视频和数据传输开发的私有协议，在Flex中的主要应用时ShareObject。 原始RTMP协议是维护了一个基于TCP唯一的长连接，允许实时通信。它有三种变种：1)工作在TCP之上的明文协议，使用端口1935； 2)RTMPT封装在HTTP请求之中，可穿越防火墙； 3)RTMPS类似RTMPT，但使用的是HTTPS连接； RTMP协议是被Flash用于对象,视频,音频的传输.该协议建立在TCP协议或者轮询HTTP协议之上. RTMP协议就像一个用来装数据包的容器,这些数据可以是AMF格式的数据,也可以是FLV中的视/音频数据.2. AMF：AMF(是Action Message Format的缩写)是在flash和flex中remoting的一种方式格式。在Flex中的主要应用是RemoteObject。AMF协议是基于Http协议的。它的内容处理过程大致是这样：1、从客户端获取Http请求(Request)流.2、对流进行解串行化(Deserialize)，得到服务器端程序能够识别的数据，并建立一个响应(Response)消息3、Debug开始4、对流进行各种处理(记录、许可、服务)得到返回值5、对响应流进行串行化6、发送Http响应给客户端十五， 与HTML比较1. 文件大小（缺）。Flex文件比HTML文件大，据我实验，在同样空白的两个页面中各放入100个按钮，Flex生成的swf文件时274k，而HTML得到的页面大小是10k。因为Flex生成的是一个swf文件，它会将mxml代码和所有的icon文件和必需的程序文件都保存在此swf文件中；而HTML文件中只有html代码，而不包括其他代码和图片，其他代码会保存在一个DLL文件中。2. 开发效率（优）。两者的开发效率无疑是因人而异的，就小弟而言，Flex比HTML的开发效率略高。具体体现在，l 前台显示：主要差别在控件上，其中有：控件的多少、控件本身的功能和控件本身的样式等。l 后台数据处理：目前主要有三种HttpService、WebService和RemoteObject三种。Ajax和.net主要用的是HttpService来与IIS进行交互，而Flex可以用以上三种的任意一种。据Adobe公司称，RemoteObject的数据处理和传输的速度比前两者的都要快。各自的具体工作原理在下面会有详解。l 兼容性：HTML和JavaScript都要考虑兼容性问题，而flex则不需要考虑此问题。3. 运行效率（未知）。Flex生成的前台文件比较大，所以在初始化的下载方面运行效率肯定会低，而Flex使用RemoteObject的速度又比较快，所以具体两方面的优劣程度如何还未知，有待确认。4. 外观效果（优）。Flex自带控件的样式比HTML自带控件样式要美观。而且在自定义样式方面，flex同样支持css样式表的配置。5. 实时性（优）。flex有rmtp协议的支持，可以用shareObject对象来进行客户端与服务端的实时同步。而HTML要想实现与flex同样的效果必须由客户端实现定时器来实时向服务端发送请求来与服务端进行同步，这样实现的缺点是对服务器的压力和对网络的压力都很大。RTMP协议时6. 兼容性（优）。HTML中的脚本语言是JavaScript，HTML在IE的各个版本和其他浏览器之间都存在着各种兼容性问题，而且JavaScript也在其中存在兼容性问题。Flex中的脚本语言是ActionScript，目前没有在flash player的第九和第十版本之间发现有差异，而Flash player与web浏览器之间没有兼容性问题，如果有那也是Adobe和浏览器之间的问题，目前没有在常用的IE和火狐中发现问题。7. 运行环境（缺）。HTML的运行环境是web浏览器，而flex的运行环境则是web浏览器和FlashPlayer。如果没有安装FlashPlayer的浏览器是不能运行swf文件的。十六， 新建项目。对于开发者来说第一件事就是如何创建一个Flex项目。Flex项目和其他项目有点不一样，因为它需要包含SWC (Flex库) Flex library SWC (不像ActionScript项目) 编译生成的可被Flash播放器执行的SWF文件(不像Flex Library项目)。1. 要想创建项目，在Flex Builder视图中点击工具栏中的File，在下拉菜单中选择 NewFlex Project，然后会弹出创建项目对话框。2. 在弹出的页面中设置图片中标注的红色部分后，点击Next按钮，项目名称项目保存路径项目类型：Web应用程序、桌面应用程序选择服务端的应用程序类型，我们可以选择A，如果选择None，则运行程序的时候会在资源管理器中打开，而不是以网站的形式打开3. 设置上一步中选择的Asp.Net的服务器的配置，设置完成后点击Validate Configuration，然后再点击Next即可，选择运行时候的打开方式：1利用.net自带的服务应用程序打开2利用IIS的虚拟目录打开选择Flex程序保存的路径，一般用默认的在IIS中虚拟目录的地址生成的swf文件的输出路径修改虚拟目录后的应用按钮4. 以上设置都不需要修改，最后点击完成即可。5. 点击完成后，会在导航栏（Flex Navigate）中存在一个flex项目，而且默认的mxml文件已经在编辑窗口打开，如下十七， 设置版面布局。1. 切换到视图模式2. 从工具/元件栏（Components view）中拖一个“Label”控件到页面舞台中。3. 在属性窗口（Flex Properties）中l 在Common区域中找到Text属性，并修改内容为“这是第一个Flex程序”l 在Style区域中找到Text属性，并修改字体大小内容为21，并点击“B”l 在Layout区域中找到X，Y属性，并修改内容分别为100,1004. 再向页面中拖一个TextInput控件，并按照上面的配置进行设置。5. 切换到代码（Source）模式后，会在mxml代码中显示如下：6. 点击运行按钮，即可预览效果十八， 绑定数据和事件1. 新建一个ArrayCollection变量，使用mxml新建一个Array标签，如下2. 为标签添加属性id，并赋值为roomList3. 为此Array添加子项，如下 room1 room2 room3 room44. 在视图状态下，为界面上拖放一个List控件，并在属性栏中为dataProvider属性赋值roomList，然后保存并运行，效果为5. 为list添加一个itemClick的委托并赋侦听事件为changeHandler(event)，代码如下：6. 新建侦听事件changeHandler(event)，所有函数代码都写在标签中，在添加Script标签时，在输入到第一个script标签的结束括号时，Flex Builder会将其余部分自动完成，接着在标签中添加一个名为changeHandler的函数7. 开始调试，点击在编辑器的右上方的open Perspective，并切换到Flex Debugging8. 在程序中添加一个断点，9. 保存并点击调试按钮10. 在预览的界面上点击list中的任一项，焦点会自动切换到Flex Builder中，并在Variable选项卡中可以看到roomList的值十九， 通过httpservice Request为控件赋数据源1. 打开项目中的adobeODT.mxml，删除roomList的Array代码，并在script标签中添加如下代码：import mx.coll