第二章 Flex的开发

第二章 Flex 2 应用程序开发入门

本章节的内容包含了 对 Flex 系列产品的概述，以及关 于 Flex 基础理论的相关教程。

关 于 Flex

Flex 提供了为专业开发人员所熟知的、基于标准的编程模式，以及一套发布高品 质 RIAs 的设计产品 。 RIAs 为 web 应用程序带来了快速响应并且内容丰富的桌面软件，以满足更有效力的用户体验 。 Flex 使用了卓越超凡 的 Adobe® Flash® Player 9 ，允许开发人员无缝地扩展浏览器的能力，发布丰富并且快速响应的客户端应用、与服务器端更为健壮的整合功能、以及面向服务器端的体系构架。

关 于 Flex 产品系 列

Flex 产品系列包括了进行设计、开发、发布整 套 RIA 所需的一系列产品。它们是 ：

1. 1. Adobe® Flex™ 2 SDK
2. 2. Adobe® Flex™ Builder™ 2
3. 3. Adobe® Flex™ Data Services 2
4. 4. Adobe® Flex™ Charting 2

关 于 Flash Player 9

Flex 应用程序在浏览器中运行时，它们采用了先进 的 Flash Player 9 运行时环境去执行客户端的逻辑，渲染图形、播放动画、声音以及视频 。 Flash Player 9 提供了对高性 能 ActionScript 3.0 的支持，一如即往地展示了它极具革新技术的表达力 。 Flash Player 为开发人员提供了一个设计用户界面的平台，无论是客户端还是客户计算机上的表现 层 /presentation-tier 的逻辑执行。因 为 Flash Player 能够在所有主流的操作系统和浏览器上运行，所以你并不需要去为某个浏览器或平台进行程序定制。

另外， 在 Flash Player 9 中运行 的 Flex 应用程序可以与浏览器中所显示 的 JavaScript 或 者 HTML 互动。因此，你可以 将 Flex 融合到一个已经存在 的 web 站点或者应用程序中，包括与其它基于浏览器的构架， 如 Ajax 或 JavaScript 库一起协同工作。

关 于 Flex Software Development Kit 2

Flex 系列产品中的核心 是 Flex Software Development Kit (SDK) 。 Flex 2 SDK 是技术实现和程序编制的基础集合，它使你可以使 用 Flex 系列产品来创建应用程序 。 Flex 2 SDK 包含 了 Flex 构架（类库）， Flex 编译器，调试器 ， MXML 和 ActionScript 编程语言，以及其它实用程序 。 Flex SDK 还包括了核 心 Flex 构架类库的源代码，使你可以学习这些类的代码并扩展它们以备你自己的使用 。

Flex SDK 可以作为一个独立包进行使用，或者集成 在 Flex Builder 和 Flex Data Services 里 。

Flex 应用程序 由 MXML 和 ActionScript 源文件组成。（译者注：简而言这 ， MXML 是用来进行用户界面布局设计的标签语言 ， ActionScript 是 Flash Player 的编程语言。）

关 于 Flex Builder 2

Flex Builder 是一个使 用 Flex SDK 、 Flex Data Services 和 Flash Player 来开发应用程序的集成开发环境 （ IDE ）。 Flex Builder IDE 为开发人员提供了各种工具用来进行开发、设计、

调 试 Flex 应用程序，其中包括集成的增量编译器和单步调试器。因为它 与 Flex 2 SDK 、 Flex 程序模型 、 Flex 编程语言紧密集成，所 以 Flex Builder 可以提高开发小组中所有成员的生产力 。

Flex Builder 是建立 在 Eclipse 工作平台上的（一种对于开发工具的开源平台）。因此 ， Flex Builder 可以作为一个独立的产品或 者 Eclipse 的插件来进行安装，并且能够 从 Eclipse 工作平台上数以百计的商业和开源项目中受惠 。

Flex Builder 提供了一套针 对 MXML 、 ActionScript 、层叠样式表 （ CSS ）的代码编辑器，帮助你更加容易地管理代码的源代码操纵工具，以及帮助排除程序中故障的调试器。对于用户界面的设计， Flex Builder 支持可视化的设计视图，它可以使开发人员或者设计人员去布 置 Flex 组件，定制它们的外观，以及如何与用户进行互动 。

Flex Builder 设计视图的界面如下所示 ：

Flex Builder 进行程序编制的界面如下图所示：

关 于 Flex Data Services 2

通过使 用 Flex Data Services ，大大地增强 了 Flex 2 SDK 的功能性 。 Flex Data Services 新增了对企业信息的支持，以及对 于 Flex 2 SDK 的数据服务架构。你可以 在 J2EE 应用服务器上或 者 servlet 容器里 将 Flex Data Services 发布为一个标准 的 web 应用程序 。 Flex Data Services 能够简化操作服务器上数据的编程模式。

关 于 Flex Charting 2

以图表或图形来显示数据的方式可以使用户更容易理解数据的使用。你可以将一个简单的数据表格，通过设置它的颜色、标题、以及二维表现方式来展示为条形、圆饼形、线形、或者其它类型的图表 。

Flex 图表组件扩展 了 Flex 的构架，增加了对大多数常用图表类型的支持，包括条形、圆饼形、线形、标图形和气泡形。图表组件是动态地在客户计算机上进行渲染的，从而使它可以非常容易地平铺、翻滚、以及其它增强用户体验的互动性。你还可以使用颜色和标题来使图形更有可读性。

一个简单的图表如下所示： Flex 应用程序的特性 在 Flex 中，开发人员可以开发出符合各种需求类型的应用程序，它们是 ：

1. 1. 用户数据收 集
2. 2. 配 置
3. 3. 在客户端处理用户的输入，包括过滤和数据校 验
4. 4. 直接反馈用 户
5. 5. 多步骤处 理
6. 6. 支持大数据 集
7. 7. 实时数据推 进
8. 8. 偶尔的客户端连 接

Flex 发布模 式 Flex 平台支持范围广泛的发布模式，它们是 ：

1. 客户端模式，即应用程序只运行在客户端上而不需要服务器资源 。

2. 使用简单 的 RPC 访问服务器数据，即使 用 HTTPService （ HTTP GET 或 POST 请求） 和 WebService （通过使 用 SOAP ）。

3. Flex Data Services 模式，可以提供更为高级的特性，如数据同步、安全增强等等 。

Flex Data Services 增强 的 RPC 服务支持使 用 AMF 协议去访 问 RemoteObjects 。这样，你就可以访问远程服务器上 的 Java 对象 （ JavaBeans ， EJBs ， POJOs ）。同时 ， Flex Data Services 还提供了一个代 理 /proxy 以方便对服务器端数据的存取。

关 于 Flex Builder 的界面模 式

Flex Builder 提供两种界面模式：即开发设计模式、调试模式。你可以在主菜单中 的 Window>Perspective> 下对两者进行切换。 Flex 开发界面模式

打开开发界面模式，你将看到代码编辑器，它包括了导航 栏 /Navigator view 、调试 栏 /Problems view 、以及概述视图栏 。

Flex Builder 中的代码提示

代码编辑器包含了许多特征可以帮助开发人员简化他们的工作。其中最重要的特征称之为代码提 示 / 内容协 助 /Content Assist （译者注：内容协助是其英文的直译，不太好，所以根据它的实际意思意译成代码提示），它将在你输 入 MXML 、 ActionScript 以 及 CSS 代码时给出完整的提示。请键 入 Control+Space 以打开代码提示。

在 Flex Builder 中设 计 Flex 应用程序

在开发界面中有两种设计方式：代码输入方式和可视化设计方式，你可以自由地在两者之间进行切换。当你选择可视化设计方 式 /Design mode 时， Flex 界面上将出现设计面 板 /design canvas 、所支持的组 件 /Components 、以 及 Flex 属性 栏 /Properties views 。

Flex 调试模式你可以在代码编辑器中查看和编辑出错或被警告的代码。同时，你还可以设置断点、或单步执行来帮助你进行程序的调试。

编译应用程序

每当项目资源作出改动后 ， Flex Builder 便会自动地 将 Flex 和 ActionScript 3.0 编译 成 SWF ，并与相应 的 HTML 页面一起放置到项目的输出文件夹中。