译者：Balan

原文：Building and running Flex applications (from 'How Flex Works', Adobe Flex 2 Help)

Flex是一种开发和运行环境，我们可以通过它创建富网络应用程序(RIA)，这些程序使用Adobe® Flash® Player 9来传递更加直观和更富有交互性的在线体验。

Flex应用程序开发流程

以下是创建Flex应用程序的典型步骤：

  • 使用一组预定义的组件(表单，按钮等)定义应用界面
  • 将组件组织到用户界面设计中
  • 使用样式和主题限定视觉设计
  • 添加动态行为(比如应用各个部分之间的交互)
  • 如有需要，定义并连接数据服务
  • 将源代码编译为运行在Flash Player中的SWF格式文件

以上只是典型的开发流程；我们不必遵照精确的顺序操作。

Flex应用的元素

典型的Flex应用包含以下元素

Flex 框架

Adobe® Flex 2 框架包含所有我们构建RIA所需要的组件：  

  • 用来展示应用的容器
  • 用来从用户那里采集数据和管理用户界面的控制器
  • 大规模的数据绑定、格式化和验证特性
  • 事件驱动的开发模型，提供丰富的用户界面转换特性，例如effects和transitions

Flex框架含于一个共享组件库(SWC)内。

MXML

 

每个Flex应用至少要包含一份MXML文件，作为主应用文件。 MXML是一种实现了XML的标记语言。它专为创建Flex应用而设计，可以显示的定义使用标签的应用程序的结构。

ActionScript 3.0

ActionScript和JavaScript类似，都是ECMAScript的实现。ActionScript 3.0可以将动态行为添加到应用程序中：1，直接作为script块添加在MXML文件中；2，创建独立的ActionScript函数文件，再引入到MXML文件中。

CSS

视觉组件(buttons、list boxes等)中的样式属性(attributes)受组件属性(properties)的控制。举例来说，按钮(button)组件拥有字体族(fontFamily)属性，用作设定自身字体。样式属性受多种因素控制：主题(theme)、CSS文件中定义的样式、MXML文件中样式块(style blocks)定义的样式，或者在组件实例中设定的自身样式属性。

Graphic assets

和大部分应用一样，Flex应用包含各种各样的图形资源(Graphic assets)，比如图标和其他图像。

Data

一些组件用作展示数据(比如combo box 或 data grid)。我们使用数组、集合对象、数据模型和外置XML数据源等等来为这些组件填充数据。

Flex应用如何编译、部署

所有这些元素的终点要么是编译成你的Flex应用，要么是连接到你的Flex应用，如下图所示：

flex 组织架构图 flex working_网络应用

Flex应用被编译为可以在Flash Player中的SWF文件。当源代码被编译为Flex应用程序时，也就被转换成了ActionScript类，之后又和图形或其他资源一起合并为SWF文件。运行的时候，Flex应用程序的SWF文件视需要而和外部库、服务和数据服务交互。

标准的Flex应用不需要服务端Flex服务。因此，在本地编译并从WEB服务器上的HTML页面发布给你的用户即可。

当然了，你可以使用Adobe® Flex Data Services 2，Cold Fusion Flash Remoting Service，或者其他的Java 和 J2EE服务来创建Flex应用，这时的Flex 应用从应用服务器中发布。(译者注：其实此时不是必须使用应用服务器)

MXML: Flex知识的起点

我们在MXML中用Flex组件定义用户界面。下面是一个作为主MXML应用文件的例子： 

<?xml version="1.0" encoding="utf-8"?> 
 <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
 <mx:Panel>
 <mx:TextArea text="Say hello to Flex!" />
 <mx:Button label="Close" />
 </mx:Panel> 
 </mx:Application>

如果你对XML熟悉的话，一眼就认出例子采用的格式了。MXML在前两行包含了版本、编码类型和命名空间信息；文件体(正文)部分则包含了内容。

所有Flex应用的内容部分都被包在<mx:Application> 这个父标签内，添加进来的组件被当作子标签。

这个例子创建了一个简单的"Say hello to Flex!" 应用程序。文本区(TextArea)和按钮(Button)组件都是通过标签声明的；文本内容和按钮名称都是标签的属性(Text和lable)值。

注意

MXML文件的每个标签都以mx开头，mx是专为Flex设计的名称。

编译并运行那个例子应用：

flex 组织架构图 flex working_网络应用_02

Flex程序就作为SWF运行在浏览器中了。