ActionScript 3.0中提供的数据加载请求类主要是HTTPService,URLLoader和URLRequest,可以通过他们协同来完成数据加载和请求。下面我么便来看看这三个类是怎么来完成数据加载工作。
在本地IIS服务器上有如下定义的XML文件:
1 <?xml version="1.0" encoding="utf-8" ?>
2 <Root>
3 <Book>
4 <Id>1</Id>
5 <Name>《三国演义》</Name>
6 <Author>罗贯中</Author>
7 <Price>52.30</Price>
8 </Book>
9 <Book>
10 <Id>2</Id>
11 <Name>《西游记》</Name>
12 <Author>吴承恩</Author>
13 <Price>39.91</Price>
14 </Book>
15 <Book>
16 <Id>3</Id>
17 <Name>《红楼梦》</Name>
18 <Author>曹雪芹</Author>
19 <Price>48.20</Price>
20 </Book>
21 <Book>
22 <Id>4</Id>
23 <Name>《水浒传》</Name>
24 <Author>施耐庵</Author>
25 <Price>39.85</Price>
26 </Book>
27 </Root>
一、使用HTTPService传递和加载数据
使用HTTPService可以实现加载数据,也可以实现参数传递,下面通过两个示例程序来讲解这两个知识点。
首先来看看HTTPService加载数据的方式。在Flex中使用HTTPService来装载外部数据是非常简单的,他是基于 HTTP协议发送POST和GET请求外部数据,然后通过指定的监听方法来处理响应。我们可以通过<mx:HTTPService>标签来完成对数据源的连接,也可以通过可编程方式来处理,两种方式没什么大的差距,实际开发中可以根据自己喜好选择。
1 internal function onClick():void
2 {
3 var service:HTTPService = new HTTPService();
4 service.url = "http://localhost:1146/Data/Book.xml";
5 service.useProxy = false;
6 service.resultFormat="e4x";
7 service.addEventListener(ResultEvent.RESULT,onResultHandler);
8 service.send();
9 }
10
11 internal function onResultHandler(evt:ResultEvent):void
12 {
13 var xml:XML = evt.result as XML;
14 trace(xml);
15 bookGrid.dataProvider = xml.Book;
16 }
该示例的运行结果见文章最后,下面是这个示例的完整代码:

完整示例代码
1 <?xml version="1.0" encoding="utf-8"?>
2 <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
3 <mx:Script>
4 <![CDATA[
5 import mx.rpc.events.FaultEvent;
6 import mx.rpc.events.ResultEvent;
7 import mx.rpc.http.HTTPService;
8
9 internal function onClick():void
10 {
11 var service:HTTPService = new HTTPService();
12 service.url = "http://localhost:1146/Data/Book.xml";
13 service.useProxy = false;
14 service.resultFormat="e4x";
15 service.addEventListener(ResultEvent.RESULT,onResultHandler);
16 service.send();
17 }
18
19 internal function onResultHandler(evt:ResultEvent):void
20 {
21 var xml:XML = evt.result as XML;
22 trace(xml);
23 bookGrid.dataProvider = xml.Book;
24 }
25 ]]>
26 </mx:Script>
27
28 <mx:Panel x="49.5" y="94" width="419" height="267" layout="absolute" fontSize="12" title="使用HTTPService加载XML数据">
29 <mx:DataGrid x="10" y="10" width="377" id="bookGrid">
30 <mx:columns>
31 <mx:DataGridColumn headerText="编号" dataField="Id"/>
32 <mx:DataGridColumn headerText="书名" dataField="Name"/>
33 <mx:DataGridColumn headerText="作者" dataField="Author"/>
34 <mx:DataGridColumn headerText="价格" dataField="Price"/>
35 </mx:columns>
36 </mx:DataGrid>
37 <mx:ControlBar height="42">
38 <mx:Button label="加载数据" fontWeight="normal" click="onClick()"/>
39 </mx:ControlBar>
40 </mx:Panel>
41 </mx:Application>
42
OK,我们来看看使用HTTPService传递参数到服务端是怎么实现的。使用HTTPService传递参数可以通过两种方式实现,分别如下:
1、直接在请求URL后面跟上参数列表,如:http://localhost/web/Test.aspx?a=1&b=2。
2、通过Flex SDK为我们提供专门用语参数传递的对象(URLVariables)来实现。
下面以一道简单的加法运算来演示HTTPService传递参数的使用,在Flex里将需要进行加法运算的两个数传递到.NET服务端并计算其和后返回给Flex客户端,两种方式传递没有太大的区别,详细请看如下代码演示:
1 /**
2 * 通过RUL参数直接传递
3 * */
4 internal function onClick():void
5 {
6 var service:HTTPService = new HTTPService();
7 var a:String = txtA.text;
8 var b:String = txtB.text;
9 service.url = "http://localhost:1146/OperationHandler.ashx?a="+a+"&b="+b;
10 service.useProxy = false;
11 service.resultFormat="e4x";
12 service.addEventListener(ResultEvent.RESULT,onResultHandler);
13 service.send();
14 }
15
16 /**
17 * 通过URLVariables进行参数传递
18 * */
19 internal function onClick():void
20 {
21 var service:HTTPService = new HTTPService();
22 service.url = "http://localhost:1146/OperationHandler.ashx";
23 service.useProxy = false;
24 service.resultFormat="e4x";
25 service.addEventListener(ResultEvent.RESULT,onResultHandler);
26 var param:URLVariables = new URLVariables();
27 param.a = txtA.text;
28 param.b = txtB.text;
29 service.send();
30 }
下面是完整的示例代码,可以把onClick()方法相互切换来测试两种不同的参数传递方式。

完整的示例代码
1 <?xml version="1.0" encoding="utf-8"?>
2 <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
3 <mx:Script>
4 <![CDATA[
5 import mx.rpc.events.FaultEvent;
6 import mx.rpc.events.ResultEvent;
7 import mx.rpc.http.HTTPService;
8
9 /**
10 * 通过RUL参数直接传递
11 * */
12 internal function onClick():void
13 {
14 var service:HTTPService = new HTTPService();
15 var a:String = txtA.text;
16 var b:String = txtB.text;
17 service.url = "http://localhost:1146/OperationHandler.ashx?a="+a+"&b="+b;
18 service.useProxy = false;
19 service.resultFormat="e4x";
20 service.addEventListener(ResultEvent.RESULT,onResultHandler);
21 service.send();
22 }
23
24 /**
25 * 通过URLVariables进行参数传递
26 * */
27 // internal function onClick():void
28 // {
29 // var service:HTTPService = new HTTPService();
30 // service.url = "http://localhost:1146/OperationHandler.ashx";
31 // service.useProxy = false;
32 // service.resultFormat="e4x";
33 // service.addEventListener(ResultEvent.RESULT,onResultHandler);
34 // var param:URLVariables = new URLVariables();
35 // &nbs;= new URLVariables();
35 // param.a = txtA.text;
36 // param.b = txtB.text;
37 // service.send();
38 // }
39
40 internal function onResultHandler(evt:ResultEvent):void
41 {
42 ab.text = evt.result.toString();
43 }
44 ]]>
45 </mx:Script>
46
47 <mx:Panel x="49.5" y="94" width="419" height="126" layout="absolute" fontSize="12" title="使用HTTPService传递参数">
48 <mx:TextInput x="33" y="10" width="91" id="txtA"/>
49 <mx:Label x="10" y="12" text="A:"/>
50 <mx:Label x="132" y="12" text="B:"/>
51 <mx:TextInput x="165" y="10" id="txtB" width="79"/>
52 <mx:Label x="252" y="12" text="A+B:"/>
53 <mx:TextInput x="293" y="10" width="95" id="ab"/>
54 <mx:ControlBar height="44">
55 <mx:Button label="计 算" fontWeight="normal" click="onClick()"/>
56 </mx:ControlBar>
57 </mx:Panel>
58 </mx:Application>
59

OperationHandler.ashx
1 public class OperationHandler : IHttpHandler
2 {
3
4 public void ProcessRequest(HttpContext context)
5 {
6 context.Response.ContentType = "text/plain";
7
8 int a = int.Parse(context.Request.QueryString["a"]);
9 int b = int.Parse(context.Request.QueryString["b"]);
10
11 context.Response.Write((a + b).ToString());
12 }
13
14 public bool IsReusable
15 {
16
Flex Data Binding详解
Data BindIng简单的说就是当绑定源属性发生变化时,Flex 会把绑定源变化后属性的值赋给目的物的属性。做到了数据同步。
收藏 0赞 0分享
关于Flex 初始化的research
前些天在写一个自定义的UI组件的时候,发现在override createChildren的,只能取到基本类型的自定义变量,而取不到Object类型的自定义变量。
收藏 0赞 0分享
flex 简单例子(含实例效果图 源码)
要过节了,工作任务也完成了,闲来没事,研究svg,感觉市场上对svg支持度不高,导致了这项技术不能够被IT群众充分的接纳,一个没有人支持的技术,她必然也不会有很大的前景。研究来研究去,还是觉得flex比较好玩。
收藏 0赞 0分享
Flex3 界面布局教程
国庆期间,做了不少基于 flex 的开发工作,对 flex 的布局容器有了进一步深入的理解,也找到不少非常棒的文章,分享到这里方便一下大家。
收藏 0赞 0分享
Flex3 界面布局教程 第二篇
国庆期间,做了不少基于 flex 的开发工作,对 flex 的布局容器有了进一步深入的理解,也找到不少非常棒的文章,分享到这里方便一下大家。
收藏 0赞 0分享
Flex 3 布局容器学习笔记 整理
国庆期间,做了不少基于 flex 的开发工作,对 flex 的布局容器有了进一步深入的理解,也找到不少非常棒的文章,分享到这里方便一下大家。
收藏 0赞 0分享
查看更多