FlexFlex 基础介绍及基础介绍及 FlexFlex 报表使报表使用用

提纲提纲Flex 开发调试环境准备Flex 编程基础报表控件与 Java 的整合嵌入 JSP 页面

11 、开发环境、开发环境最新版本的官方提供的开发工具是 Adobe

Flash Builder 4 ，同时提供了一个 Adobe Flash Builder 4 Plug-in Eclipse 版本，这两个安装后都拥有相同的功能，可以任选版本安装；安装之后，会自动按照 flex sdk4.x 版本。

22 、调试环境、调试环境播放器： debug 版本的 flash player浏览器：建议安装 Fixfox ，并安装以下插件

：1. debug 版本的 FireFox Flash Player 插件2. HttpFox 插件：可以查看 HTTP 通信的过程和数据，还能看到

哪些内容是从 Cache 里面读取的3. FlashBug ：能显示您在程序中用 trace() 语句输出的调试信

息4. Cache Status ：可以让我们方便的管理缓存

33 、其他、其他 -- 可以在可以在 FLEXFLEX 项目项目的的可以在 FLEX 项目的属性中的“ flex 编译器”下的

“附加的编译器参数”中，增加以下参数： -keep-generated-actionscript=true ；增加该参数后， Flash Builder 会在工程的源代码路径下自动创建一个 generate 文件夹来存储由 MXML 文件翻译成的 ActionScript 临时文件，通过这种方式，额可以加快学习速度。

FlexFlex 编程基础编程基础MXML 编程ActionScript 编程Flex 组件Flex 控件

11 、、 FlexFlex 服务的组成服务的组成

Flex 表 现 层 服 务

Flex 应用框架

Flex 类库

Flex 运行服务

22 、、 MXMLMXML 和和 ActionScriptActionScript MXML 是一种 XML 语言，最基本的作用是用来布局 Flex 应用

程序的用户界面。 MXML 也可以用来定义不可视的 Flex 应用。例如，它可以定义数据源，并将数据源绑定到用户界面。

ActionScript 类似于 JavaScript 的强类型面向对象编程语言。它包括了已有的对象和功能，也允许建立自定义对象和功能。它基于 ECMA-262 Edition 4 标准。使用 ActionScript ，用户可以定义事件监听、得到和定义组件属性、控制返回程序、建立新的类、包和组件。

http://livedocs.adobe.com/flex/3_cn/langref/statements.html：这个网址介绍了 Flex 的基本语法及各种关键字的意思，注意关注与 Java 语法的不同之处，比如定义常量使用关键字const ，而 final 关键字只能作用在方法或类上。

33 、、 MXMLMXML 和和 ActionScriptActionScript 的的关系关系 在 Flex 编程中，编程者使用两种语言来进行 Flex 应用编程：

MXML 和 ActionScript 。一般来说， MXML 实现了在 MVC（ Model 、 View 和 Control）编程模式中的 View（视图）部分，而 ActionScript则完成 Model（模式）的部分。

Flex 实际上是 ActionScript 类的库。这个库包括了组件（容器和控件）、管理类、数据服务类等。 MXML 标签相当于ActionScript 中的类的属性。 Flex分解并编译 MXML 标签为SWF 文件。例如， Flex 提供 ActionScript 按钮类，在MXML 中则用 <mx:Button> 来定义按钮。

44 、需要关注的基础知识、需要关注的基础知识 ---- （（ 11））MXML 标签规则 不是所有的标签都要求有 id 属性。 所有的根标签都不能有 id 属性。 布尔属性只有 true 和 false 两个值。 <mx:Binding>要求有 source 和 destination 属性。 <mx:Binding> 标签不能有 id 属性。 <mx:WebService> 标签要求wsdl 和 serviceName 中的其中一项，但不允

许两者一起出现。 <mx:RemoteObject> 标签要求 source 和 name 中的其中一项，但不允许两

者一起出现。 <mx:HTTPService> 标签要求 url 和 serviceName 中的其中一项，但不允许

两者一起出现。 <mx:operation> 标签要求 name值，但不允许重复 name 的值。 <mx:operation> 标签不能有 id 属性。 <mx:method> 标签要求 name值，但不允许重复 name 的值。 <mx:method> 标签不能有 id 属性。

44 、需要关注的基础知识、需要关注的基础知识 ---- （（ 22））MXML 与其它相关的标准 XML 标准 :MXML 文件实际上是一个 XML 文件。 XML 是 EXtensible

Markup Language 的缩写。 事件模型标准 :Flex 中的事件模型是 Document Object Model (DOM)

Level 3 Events 的子集。 Web Services 标准 ;Flex 提供了标签来调用 Web Services 。 Java 标准 :Flex 提供 MXML 标签与服务器端的 Java Object产生联系，包括

Plain Old Java Objects （ POJOs）、 JavaBeans 和 Enterprise JavaBeans （ EJBs）。

HTTP 标准 :Flex 提供 MXML 标签来建立把这的 HTTP GET 和 POST要求，并且可以得到 HTTP 的返回值。

图形标准 :Flex 提供 MXML 标签来使用 JPEG 、 GIF 和 PNG图像格式，同时也提供标签来使用 SWF 文件和 Scalable Vector Graphics （ SVG）文件。

样式表单（ Cascading Style Sheets）标准 :MXML 的样式上使用 W3C Cascading Style Sheets （ CSS）标准的。 CSS 提供了对 Flex 组件的外观和效果定义的途径。

44 、需要关注的基础知识、需要关注的基础知识 ---- （（ 33））变量默认值

数据类型 默认值布尔值 (Boolean) False

整数 (Int) 0

数字 (Number) Nan(not a number)

对象 (Object) Null

字符串 (String) Null

自然数 (Uint) 0

未声明 (not declared) Undefined 。如果 delcare 一个变量但没有 declare 其数据类型，就意味着此变量为无类型的，其默认值则是 undefined

其他类，包括用户自定义的类 Null

55 、、 FlexFlex 组件（组件（ ComponentsComponents）） 所有用来建立 Flex 应用程序的子类都是 Flex 组件。 Flex 提

供了以组件为基础的编程模式。编程者可以使用组件来建立应用和用户界面。 Flex 包括了大量的已经定义好的，非常灵活的组件。根据实际需求，用户还可以建立自定义的组件。可以通过以下方面来设计一个组件。

样式（ Styles）：样式就一个组件的特色，如字体、字体颜色、字体大小、文本对正等。这些都可通过样式表单（ CSS）来定义。

行为（ Behaviors）：指控件对用户动作或应用的可视改变。例如，使用鼠标移动和改变控件大小。

事件（ Events）：指控件的响应。事件包括组件建立、鼠标行为和按钮动作。

外观（ Skins）：控件的外观的类。 大小（ Size）：控件的高度和宽度。所有的组件都有默认的大小。

编程者可以使用其默认大小，也可以定义其大小。

66 、组件的类继承关系、组件的类继承关系 所有的组件都是由 ActionScript 的 Sprite 类和

UIComponent衍生的。它继承了父类的属性和方法，如对事件、风格和行为的定义。 UIComponent 是所有组件的基本的类。 UIComponent 有以下常用属性：

属性 类型 描述可使用 (enabled) 布尔 定义组件是否可使用

高度 (height) 数字 组件的高度，可设置为绝对值或相对值

宽度 (width) 数字 组件的宽度，可设置为绝对值或相对值

标示 (id) 字符串 组件的标识符

百分比高度 (percentHeight) 数字 定义组件的风格类

百分比宽度 (percentWidth) 数字 组件的高度，百分比相对值

分格 (styleName) 字符串 组件的宽度，百分比相对值

可视 (visible) 布尔 定义组件是否可视

X(横坐标 ) 数字 组件相应于父类的 x 绝对值定位

Y(纵坐标 ) 数字 组件相应于父类的 y 绝对值定位

77 、组件的大小和定位、组件的大小和定位 Flex 提供了以下 4 种定义控件大小的方式： 默认大小（ Default sizing）： Flex 自动定义控件和容器的大小。 绝对值尺寸（ Explicit sizing）：用户定义高度和宽度的像素值。 百分比（ Percentage-based sizing）：用户定义相对于其父类容

器的百分比值。 约束布局（ Constraint-based layout）： Flex 通过定义组件在其父类容器的四边和中心位置来控制大小和位置。

Flex 提供了以下两种定位方法： 自动布局（ Automatic Layout）， Flex 自动定位子类控件

在容器中的位置。 约束布局（ Constraint-based layout），通过定义组件在

其父类容器的四边和中心位置来定位。 使用约束布局是，不需要定义子类组件的 x ， y 的绝对值，但需要定义子类组件到父类容器四边的距离。

88 、、 FlexFlex 控件控件 (Controls)(Controls) Flex 控件是构成用户界面基本元素。 Flex 有两种类型控件：

基础控件和数据源控件。按照其使用用途，可以分为以下 5 类：

1. 文本控件（ Text Controls）2. 数据源控件（ Data Provider Controls）3. 菜单控件（Menu Control）4. 按钮控件（ Button Control）5. Flex 控件（ Flex Controls）

99 、、 FlexFlex操作操作 propertiesproperties 文文件件 例如在资源文件包下面新建一个 message.properties 文件

，包含有以下内容： casemanager.btn.save = save

有以下两种常用方法：1. 通过 @Resource 标签使用： <mx:Button

label="@Resource(key='casemanager.btn.save',bundle='message')" />

2. 通过 ResourceManager 工具类使用：ResourceManager.getInstance().getString("message","casemanager.btn.save")

其中，红色标记部分，与文件名去掉” .properties” 之后的字符串相同

通天对 properties 文件的操作，可以方便的实现国际化。 [可通过以下语句动态的修改当前语种类型：ResourceManager.getInstance().localeChain = ['zh_CN']; ]

1010 、视窗状态、视窗状态 (View States)(View States) 视窗状态可以让同一个组件或应用程序具有更多的内容和外观

，特别是对用户行为的回应。最简单例子就是定义一个基本默认的状态作为登录（ login）页面，当登录成功后，显示另一个状态，即登录后的页面。 Flex 程序中可以定义一个或多个不同的状态。通常还可以使用过渡行为来改变视窗状态。

1111 、嵌入外部资源、嵌入外部资源在 Flex 应用程序中，可以使用外部的资源，例如图像，音像，还有文字等。通常可以在编译时将这些资源加入到程序中，通常这个过程称为“嵌入外部资源（ embedding the asset）”。

嵌入外部资源的好处在于由于已经被编译过程加入到了程序中，因此可以更加快速的进行访问。而其缺点在于编译后的 SWF 文件会比较大。

FlexFlex 数据数据1 、获取环境信息JavaScript共享对象HttpService 、 WebService 、 Rem

oteObject[ 和 java 的数据转换关系158 页 ]

表达数据数据绑定

报表报表

性能优化性能优化

与网页进行交互与网页进行交互

性能性能组件加载顺序、布局内存