第1篇 进入Flex 4大门.ppt

1.1 Flex 4简介 1.2 Flex 4开发环境介绍 1.3 MXML语言简介 1.1.1 RIA概述 1.1.2 Flex概述 （1）MXML。MXML是基于XML的标记语言，用于应用程序用户界面的布局，控制组件的样式和外观等。 （2）ActionScript 3.0。ActionScript 3.0是一种符合ECMA规范的面向对象脚本语言，类似于JavaScript，运行于Flash Player平台，增强了Flash平台的能力，是Flex 4的核心编程语言。ActionScript 3.0可以完成MXML不能完成的任务，例如，控制事件，绑定数据对象到Flex控件，定义用户组件等。 （3）Flex SDK。Flex SDK（Software Development Kit）是Flex开发工具包。目前最新版本是Flex 4.1 SDK，用于编译Flex程序（如同JDK）。 （4）Flash Builder 4。Flex 4中的开发环境已经更名为Flash Builder，而不是原来的Flex Builder系列。使用此集成开发环境（IDE），开发者可以快速高效地开发富互联网应用程序。 1.2.1 Flex 4 SDK介绍 下载的Flex 4 SDK是一个flex_sdk的压缩包，解压缩该文件到相应目录下即可，如解压到E:\flex_sdk。解压后目录结构如图1.3所示。 在使用Flex SDK之前需要设置环境变量，右键单击“我的电脑”选择“属性”，单击“高级”选项卡，单击“环境变量”按钮，编辑“Path”环境变量（没有则新建），添加Flex SDK的bin路径，如E:\flex_sdk\bin，如图1.4所示。 接下来，测试Flex SDK设置是否正确。首先，新建一个文本文件test.as（Flex类文件），存放在E盘下。test.as文件内容如下所示： package { import flash.display.Sprite; public class test extends Sprite { public function test(){} } } Flash Builder 4的下载与安装请参考书中内容进行 Flash Builder 4启动后的主界面如下图所示。 Flash Builder 4工作平台在开发应用程序时包含代码模式和设计模式。 1．代码模式 代码模式包括包资源管理器窗口、大纲窗口、代码编辑窗口、问题窗口等，如图1.13所示。 2．设计模式 在代码模式的代码编辑窗口中单击“设计”按钮即可进入设计模式，在设计模式中开发者可以通过界面方式开发应用程序。除了包资源管理器窗口和问题窗口，设计模式还包括设计窗口、组件窗口、状态窗口、属性窗口、外观窗口等，如图1.14所示。 1.3.1 MXML概述 与HTML类似，MXML是一种XML标记语言，但是专门用于Flex程序，使用它能方便快捷地完成人机界面组件的布局。 MXML的基本语法非常简单，例如，要创建一个按钮控件，使用如下代码： s:Button x=330 y=154 label=按钮 id=ok_btn/ 其中，x和y的属性为按钮定义在界面中的坐标，id属性为Button控件定义一个唯一的名称，以后可以使用该名称应用Button控件，label属性用于设置在按钮上显示的标签文本。 MXML的基本语法非常简单，例如，要创建一个按钮控件，使用如下代码： s:Button x=330 y=154 label=按钮 id=ok_btn/ 其中，x和y的属性为按钮定义在界面中的坐标，id属性为Button控件定义一个唯一的名称，以后可以使用该名称应用Button控件，label属性用于设置在按钮上显示的标签文本。 用户还可以定义组件属性为它的子标签，例如，上面的Button组件还可以使用如下代码创建： s:Button id=ok_btn s:x330/s:x s:y154/s:y s:label按钮/s:label /s:Button 1．MXML文件名 MXML文件名要求如下。 （1）MXML区分大小写。 （2）MXML文件必须以小写的“mxml”作为后缀名。 （3）在ActionScript类中，变量名必须以字母或下划线开始。 （4）MXML文件名不能与ActionScript类的名称、组件名一样。 （5）MXML文件不能命名为Application。 2．组件的属性 MXML组件的属性值可以是以下几种类型。 （1）标量值，如字符串、数字、逻辑值。 （2）由标量值组成的数组，如数组和字符串数组。 （3）ActionScript对象。 （4）由ActionScript对