Flex是如何工作的

        Flex是一个提供开发设计和运行支持的架构，它可以使开发人员创建利用Flash Player 9作为前台的“富客户端互联网应用程序/Rich Internet Application/RIA”，以满足用户更为直观和极具交互性的在线体验。

开放Flex应用程序的典型步骤如下：

1、选取一系列预先定制好的、用于设计应用程序界面的组件（如表格、按钮等等）

2、布置组件以设计用户界面

3、使用样式和主题来增加视觉方面的设计

4、添加动态行为（例如程序部件之间的相互作用）

5、定义连接所需的数据库服务

6、将源代码编译成SWF文件，然后在Flash Player中运行。

一个典型的Flex应用程序包括如下元素：

1、Flex Framework

提供创建RIA所需的所有组件：用于应用程序布局规划的容器；针对用户界面和从用户处获取数据的控制；广泛支持的数据绑定、数据格式化、以及有效值验证；事件驱动的开发模式。Flex Framework被包含在公用组件库（SWC）文件中。

2、MXML

每个Flex应用程序至少包含一个MXML文件，它被作为该程序的主文件。MXML是一种标记语言，它是基于XML的一种实现，用来创建Flex应用程序。

3、ActionScriopt 3.0

为应用程序添加动态行为，它是基于ECMAScript的一种实现，类似于JavaScript。它可以作为一个脚本块，在MXML文件中直接进行添加；或者创建一个单独的ActionScript文件，然后将它们导入到MXML文件中。

4、CSS

通过设置组件的属性来改变组件的视觉样式。通常有四种方法来进行控制：通过主题（theme）；在CSS文件中进行定义；在MXML文件中的样式块中进行定义；在组件的实例中进行设置。

5、图形资源

Flex包含了各种各样的图形资源，如图标和图像。

6、数据

可以使用各种方式来将这些组件与数据联系起来，如使用数组、收集对象、数据模型、以及外部XML数据等。

 

Flex应用程序的编译和发布：

所有的元素都被编译或连接到Flex应用程序中。Flex应用程序被编译成一个SWF文件，然后在Flash Player下运行。当一个源代码被编译时，它就被转换成ActionScript类，并与图形和其他资源合并到SWF文件里。在运行时，SWF文件与所需的外部库、服务和数据源进行交互。

连接数据

Flex应用程序并不直接与一个数据库进行连接，可以使用MXML和ActionScript代码来操作和管理数据。在应用程序中可以使用HTTPService组件从PHP所产生的一个XML文件中获取数据。

连接数据库的第一步是生成将在Flex程序中使用到的数据。在与PHP的应用中，采用如下步骤：1、创建一个数据库（如MySQL）；2、编写一个PHP脚本连接MySQL数据库并生产XML格式的数据；

对于PHP所生成的XML格式数据，你可以使用HTTPService组件来请求获取数据：

< mx:Application xmlns:mx = " http://www.adobe.com/2006/mxml "  layout = " absolute " >
< mx:HTTPService
id = " productsRequest "
url = " http://www.somesite.com/products.php "   />
...

HTTPService组件定义了一个请求ID，通过这个ID来提供数据的URL或者服务器与数据之间的绑定。

通过数据与数据驱动控制的绑定，你就是可以处理HTTPService的结果（XML数据），如下：

< mx:DataGrid x = " 20 "  y = " 80 "  id = " productGrid "  width = " 400 "
dataProvider = " {productRequest.lastResult.products.items} "   >
< mx:columns >
< mx:DataGridColumn headerText = " Name "  dataField = " name "   />
< mx:DataGridColumn headerText = " Price "  dataField = " price "   />
</ mx:columns >
</ mx:DataGrid >

其XML数据源的数据结构如下：

< XML >
< products >
< item >
< name > Mobile Phone </ name >
< price > $199 </ price >
</ item >
< item >
< name > Car Charger </ name >
< price > $34 </ price >
</ item >
...

 

还可以在Flex程序组件的事件中加载数据，如下在Flex程序开始运行时加载数据：

< mx : Application xmlns : mx = " http://www.adobe.com/2006/mxml "  layout = " absolute "
creationComplete = " productsRequest.send() "   >

 

Flash Player安全性问题

在客户端的Flash Player中运行的应用程序，只有在满足如下条件之一的情况才能访问远程的数据源：

1、应用程序所编译的SWF文件与远程数据源位于同一个域中；

2、使用代理（proxy），并且你的SWF文件位于和代理相同的服务器上；

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

使用布局，事件和行为

如下示例代码演示了简单的布局、样式和事件

<? xml version = " 1.0 "  encoding = " utf-8 " ?>
<!-- MXML 文件
Flex应用程序的所有具体内容都放在 < mx:Application > 标签队中
在MXML文件中的所有标签都有mx前缀，表示Flex设计命名空间 -->
< mx:Application xmlns:mx = " http://www.adobe.com/2006/mxml "  layout = " absolute " >
     <!--< mx:Style source = " style.css " /> 使用CSS文件应用样式  -->
    
     <!-- 使用样式块应用样式，设置了TextArea（文本框）的样式 -->
     < mx:Style >
        TextArea ... {
            font-size:36px;
            font-weight:bold;
        }
     </ mx:Style >
    
     <!-- 定义动作相应函数，ActionScript脚本 -->
     < mx:Script >
         <! [CDATA[
        public  function  close(): void ... {
            myPanel.visible=false;
        }
        ]] >
     </ mx:Script >
    
     <!-- 定义特殊效果 -->
     < mx:Fade id = " myFade " />
        
     < mx:Panel id = " myPanel "  layout = " absolute "  width = " 80% "  height = " 80% "  x = " 122 "  y = " 24 "  hideEffect = " myFade " >
         < mx:TextArea text = " Hello to Flex! "  top = " 10 "  bottom = " 70 "  left = " 10 "  right = " 30 " >
         </ mx:TextArea >     
         <!--
         < mx:Button label = " Close "  right = " 80 "  bottom = " 30 "  click = " myPanel.visible=false " />     
         -->
         < mx:Button label = " Close "  right = " 80 "  bottom = " 30 "  click = " close() " />
     </ mx:Panel >
</ mx:Application >

 

Flex应用程序的特性

在Flex中，开发人员可以开发出符合各种需求类型的应用程序，它们是：

1、用户数据收集

2、配置

3、在客户端处理用户的输入，包括过滤和数据校验

4、直接反馈用户

5、多步骤处理

6、支持大数据集

7、实时数据推进

8、偶尔的客户端连接

 

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还提供了一个代理以方便对服务器端数据的存取。