flex中获取并显示数据

 

为了在应用程序中使用数据， Adobe Flex 包括了与 HTTP servers ， web services 或 remote object services （ Java objects ）进行交互的组件，这些组件被称之为远程过程调用（ RPC ）服务组件。

与 Adobe ColdFusion ， PHP 或类似的服务器技术不同， Flex 应用程序并不直接连接数据库。

举个例子，你可以在一个 Flex 文件中插入 HTTP service 来实现 ColdFusion 文件的交互，以获取 MySQL 数据库中的数据，转换成 XML ，然后返馈给 Flex 应用程序。

在本节中，你将学习创建一个简单的 blog 阅读器。你使用了被称之 HTTPService 的 RPC service 组件从 RSS 中获取数据，然后将数据绑定到 Label 、 DataGrid 、 TextArea 和 LinkButton 控件上。

 

为了完成这个项目，执行的步骤如下：

1. 设置项目

2. 检查要访问的远程数据源

出于安全的原因，在客户端计算机上 Flash Player 中运行的应用程序，只有在满足如下条件之一的情况下，才能访问远程的数据：

a. 应用程序的 SWF 文件与远程数据源位于同一个域中。

b. 使用代理，同时 SWF 文件与代理位于同一个服务器中。

c. 在数据源的宿主 web 服务器上安装 crossdomain.xml （跨域策略）文件。

本节中例子使用的是第三种方法。

第一步:

1. 在导航视图中选择 Lessons 项目，选择 File > New > MXML Application 并 创建一个叫 BlogReader.mxml 的文件。

2. 将 BlogReader.mxml 设置为被编译的默认文件。

3. 在 MXML 编辑器的设计模式下，从组件视图中拖拉出一个面板容器，并设置它的相应属性值：

Title: Blog Reader

Width: 475

Height: 400

X: 10

Y: 10

4. 在设计模式下，从组件视图中拖拉出如下组件到面板容器里：

DataGrid

TextArea

LinkButton

5. 使用鼠标将控件布置成垂直排列的、左对齐的列。

6. 选择 DataGrid 控件并设置相应属性：

Id: dgPosts

X: 20

Y: 20

Width: 400

7. 选择 TextArea 控件并设置相应属性：

X: 20

Y: 175

Width: 400

8. 选择 LinkButton 控件并设置相应属性：

Label: Read Full Post

X: 20

Y: 225

9. 点击工具条上的 Source button 切换成编辑器源代码模式。看一下 BlogReader.mxml 文件的 MXML 代码.

10. 保存文件， 完成编译后运行。

到这一步，应用程序还没有显示任何 blog 信息。接下来的一步是使用一个称之为 HTTPService 的 RPC 服务组件来获取 blog 的信息。

第二步：

插入 HTTPService 组件，对于 blog 阅读器这个项目，其数据源来自于 http://www.adobe.com/go/mchotinblog 。你使用 HTTPService 组件来访问 blog 的 XML 。该组件发送 HTTP GET 或 POST 请求，并获取反馈回来的数据。

1. 在源代码模式下，在 标签中输入 标签：

id="feedRequest"

url="http://weblogs.macromedia.com/mchotin/index.xml"

useProxy="false"/>

url 属性指明了被请求文件所在的位置。 在本例中，该 URL 一直是有效的，但是你仍然需要确定它是否已经发生改变。

useProxy 属性表明你并不打算在服务器上使用代理。 因为 Matt's blog 上面有

crossdomain.xml 设置，所以 Flash Player 可以访问该服务器上的远程数据。

接下来提示应用程序向指定的 URL 发送请求。

2. 在 标签后，添加 creationComplete 属性（粗体显示）：

creationComplete="feedRequest.send() " >

你的应用程序每次启动时， HTTPService 组件的 send （）方法将被调用。该方法向指定的 URL 发出 HTTP GET 或 POST 请求，并得到 HTTP 回应。在本例中， RSS feed 将返回 XML 数据。

接下来，检测 RSS feed 的获取是否成功。然后将数据绑定到 Label 控件上，就象这样：

3. 在 标签中，将 title 属性的值用随后的表达式替换：

title="{feedRequest.lastResult.rss.channel.title}"

当 HTTPService 组件返回 XML 时，在名叫 lastResult 的 ActionScript 对象中进行剖析。

lastResult 对象的结构反映了 XML 文档的结构。

XML 的结构通常如下所示：