Flex 3开发指南

 

Flex3开发指南

 

 有关ActionScript 3的部分，请观看本人总结的ActionScript 3详解文章！

 

 1.Flex 3是Adobe出品的开发RIA(Rich Internet Application富互联网应用)的工具，Flex 3包括:Flex 3 SDK软件开发包、编译器、Flex类库和调试工具。

 2.Flex Builder 3是基于Eclipse之上的一个开发工具，界面和使用方法很类似Eclipse。

 3.Flex的应用程序到底是什么东西？
 
  *答:其实就是把可以用Flash播放的swf格式文件封装到了HTML页面中的应用程序，
  然后程序(可以认为HTML)就可以借助Flash文件(swf)的功能(如事件等)来和服务器端进行交互。

  *注意:要运行Flex的应用程序必须在客户端安装Flash Player 9或以上的播放器才行；
  如果没有安装，那么打开Flex的应用程序时，IE下会提示通过ActiveX插件的形式在线安装。

 4.Flash Player 9安装时会有两种版本:非调试版本和调试版本。非调试版就不用说了就是用来运行Application应用的；
 
  *调试版的作用:********************后边讲到

 5.Flex 3 Application应用的实现方式:主要借助MXML文件和ActionScript 3语言(AS3)来实现。

  *MXML的作用:该文件为一个描述文件，非常类似于XML，只不过该文件中的标签都要以"mx"开头(因为名称空间指定)，例如<mx:xx> 。
  且该文件的根元素为<mx:Application> ，说白了就是通过这个文件来定义Flash的swf格式文件，
  只不过编译后就直接将生成的swf封装到了满足"一定格式"的HTML文件中了。

   **注意:我们知道Flash文件中只能有ActionScript代码，没听说过也可以有MXML文件，
   所以Flex中的这个MXML文件只是为了方便视图界面的开发和格式的美观优雅而特别订制的，
   其实运行Flex的应用时，首先会将MXML文件中的定义内容转换成相对应的ActionScript代码(变量、对象等)，
   然后在运行所有ActionScript代码，也就是说如果有MXML的内容的话就先把它们转换成ActionScript，
   然后将原来的ActionScript和刚转换成的ActionScript一起进行编译(编译后的文件默认会输出到bin-debug目录)，使之作用于Flash文件之上。

   **注意:在MXML文件中只能在<mx:Script>...</mx:Script>标签内部使用<![CDATA[ ActionScript代码 ]]>段的形式书写ActionScript代码，
   不能像在as文件中那样写ActionScript代码。

  *ActionScript 3的作用:就如上说，就是用来定义Flash文件(swf)中的对象、事件等组件的语言。

   **技巧:由上边说明知道ActionScript代码会在MXML文件内容转换完后才一起执行，
   这样一来就可以在ActionScript代码中直接引用MXML文件中通过元素定义(MXML会将元素的ID值最为定义的对象名称)的对象了，
   无需担心会访问不到，因为现将MXML转换成ActionScript，然后在统一编译执行ActionScript代码，最后生成封装有swf文件的HTML等一些文件。

   **注意:一般Flex应用中会将MXML和ActionScript这两种方式结合使用，以达到最佳效果。

 6.Flex Builder 3提供了3种类型的项目:Flex项目、Flex库项目和ActionScript项目。

  *Flex项目:就是我们要使用的。我们可以在项目中导入我们自己定义的Flex类库SWC文件(类似与Java中的jar包)。
  它有一个html-template目录，存放的是模板文件，输出到bin-debug目录中的文件就是以html-template目录中模板文件为模板生成的。
  所以修改html-template模板中的某个设置将会影响输出的内容，有的时候为了实现某个界面效果可以修改模板文件。

   **注意:SWC库(库中可以封装图片、声音等素材文件、程序(组件或自定义组件)等)文件类型分为普通类型和RSL类型，
   虽然都是库包，但是前者使用时一般要封装到swf文件中使用，就是不需另外导入对应的SWC库包；而后者就是使用RSL机制，
   让swf文件在使用SWC库中的内容时才运行(加载SWC库包)，所以需要导入SWC库包到项目，这种属于动态机制。

  *Flex库项目:就是将要封装的内容放到src中，然后编译项目，就会在bin目录中生成对一个的SWC库文件。

  *ActionScript项目:就是编写ActionScript语言对应的.as文件，然后编译生成对应的SWC库包，供Flex项目导入使用。

 7.使用MXML来实现事件处理机制:用一个例子来演示。

  <1>首先创建一个MXML Component文件，使用已有的ActionScript组件来组装一个自定义的组件。
  其实就是创建一个新类，继承已经存在的组件(如Panel)，然后在自定义类中封装几个已存在的组件作为属性，以组成自己的类！！
   <?xml version="1.0" encoding="utf-8"?>
   <mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" title="后台管理">
    <mx:Label x="41" y="30" text="用户名："/>
    <mx:Label x="41" y="76" text="密   码："/>
    <mx:TextInput id="t_username" x="119" y="28" borderColor="#0B65A4" backgroundColor="#CE6363" backgroundAlpha="0.18"/>
    <!-- displayAsPassword="true"表示输入密码后用黑点儿显示 -->
    <mx:TextInput id="t_password" x="119" y="76" displayAsPassword="true" borderColor="#0B65A4" backgroundColor="#CE6363" backgroundAlpha="0.18"/>
    <!-- 为按钮注册鼠标点击监听器事件方法clickButton -->
    <mx:Button x="119" y="123" label="登陆" width="72" click="clickButton()"/>

    <!-- 这里不是为该自定义组件注册一个Event事件，而是指定该组件可以注册这个事件，事件类型叫做"login" -->
    <mx:Metadata>
     [Event (name="login", type="flash.events.Event")]
    </mx:Metadata>

    <!-- 点击按钮触发事件方法后，为整个自定义组件的事件流中添加一个新的上边声明了的login类型的事件
    此事件添加到事件流后，如果自定义组件或子节点组件有注册login类型的监听器，那么会立即触发-->
    <mx:Script>
     <![CDATA[
      internal function clickButton():void{
       //向这个组件的事件流中制造一个新的事件，以便可以触发对应的监听器
       this.dispatchEvent(new Event("login"));
      }
     ]]>
    </mx:Script>

   </mx:Panel>
   *说明:因为表单有登陆按钮对象，所以要为按钮注册一个"登陆事件‘(即鼠标点击事件),
   当点击时当然就会触发事件监听方法，进而完成对应的功能(判断用户名、密码等)。

   *注意: 这样一个自定义组件不能独立运行，只能供一个MXML文件引用而使用。
   所以是否触发login类型的事件要看引用该组件对象的MXML文件中的声明了。见下边！！

  <2>在MXML文件中引入自定义组件，使用<ns1:LoginForm>元素引用(也可以从组件视图上拖动)。
   <?xml version="1.0" encoding="utf-8"?>
   <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:ns1="*">
    
    <!-- 事件监听方法，当自定义组件有login类型的事件发生时，就会调用loginClick()方法 -->
    <mx:Script>
     <![CDATA[
      import mx.controls.Alert;
      
      //监听器方法
      internal function loginClick(evt:Event):void{
       Alert.show("登陆成功","提示");
      }
     ]]>
    </mx:Script>

    <!-- 在MXML中引入自定义组件，并且为组件注册login类型的事件监听器，监听方法为loginClick，参数一定要传入event对象，
    之所以要传入参数是因为声明的事件监听方法要接收这个参数 -->
    <ns1:LoginForm id="loginForm" login="loginClick(event)" verticalAlign="middle">
    </ns1:LoginForm>
    *说明:login="loginClick(event)"中的login是事件类型，而loginClick则是事件监听器方法
   </mx:Application>

  <3>总结: 上边例子中，首先在自定义组件中为自定义组件声明了一个可以使用的事件类型"login"，
  然后为自定义组件中的按钮的鼠标点击事件注册监听器方法为clickButton()方法，方法体中是为自定义组件的事件流中制造一个login类型的事件。
  也就是说运行时，点击按钮后，会触发clickButton方法，然后该方法为自定义组件事件流中制造一个新的login事件，
  这回导致注册了login事件类型的监听器被调用，即loginClick被调用。这是上边例子点击登陆后的操作流程。

  <4>上边为自定义组件声明的事件类型都是ActionScript提供的事件Event类型的，我们当然也可以想在ActionScript中那样，定义自定义的事件类型。
   
   //自定义事件类型
   public class LoginEvent extends Event{
    //保存用户名
    public var username:String;
    //保存密码
    public var password:String;
    
    public function LoginEvent(type:String){
     super(type, false, false);
    }
   }

   *修改<1>中代码:
    <mx:Metadata>
     <!-- type的值改成了自定义事件类型 -->
     [Event (name="login", type="com.events.LoginEvent")]
    </mx:Metadata>
    
    <mx:Script>
     <![CDATA[
      import com.events.LoginEvent;
     
      internal function clickButton():void{
       //创建自定义事件对象，并且指定类型名为"login"
       var loginEvent:LoginEvent = new LoginEvent("login");
       //得到用户名值
       loginEvent.username = t_username.text;
       //得到密码值
       loginEvent.password = t_password.text;
       //向事件流中制造事件
       this.dispatchEvent(loginEvent);
      }
     ]]>
    </mx:Script>

   *修改<2>中代码:
    //此处参数类型改成了LoginEvent自定义类型，如果不改将会得不到username和password属性值
    internal function loginClick(evt:LoginEvent):void{
     //判断用户名和密码
     if((evt.username == "admin") && (evt.password == "admin")){
      Alert.show("登陆成功","提示");
      return;
     }
     Alert.show("登陆失败","警告");
    }

  *说明:其实我们可以直接在按钮的鼠标点击事件中进行表单的验证，不过如果这样代码的复用能力就比较差，
  因为我们可能会在很多地方都会使用自定义组件，如果验证写在鼠标单击按钮事件方法中，那么在每一次引用自定义组件后，
  如果各个需求的验证方法不同，那么就要总是修改自定义组件的鼠标点击事件方法中的代码了。
  而向上边那样写，就无需修改自定义组件中的代码了。
 
 8.数据绑定: 就是当数据源对象的数据发生变化时，目标对象的数据会自动更新，而不需要我们再编写代码去强制更新。

  * 绑定的内部原理: 绑定实际也是借助事件机制来完成的，当目标使用了数据绑定的时候，
  目标对象就会监听数据源对象的某一固定事件。当数据源发生变化时，数据源就会制造出那个固定的事件(ChangeEvent事件)，
  此时目标对象的监听机制会被触发，即通知目标对象更新数据。不过这个过程都是由Flex完成，不用我们手动干预！！

  * 绑定的前提条件: 数据源对象的数据和目标对象的数据格式相同。

  <1>方法一 : 针对MXML文件可以使用的方法。在为组件对象的元素属性赋值时，使用"{}"直接将数据源直接绑定到对象组件的某个属性上，这样就可以了。

   例子:
    <!-- 绑定语句 : fontSize="{h_slider.value}" -->
    <mx:Label id="f_label" x="319" y="61" text="滑动条数据绑定" fontSize="{h_slider.value}"/>
    <mx:HSlider id="h_slider" x="276" y="284" minimum="20" maximum="40" snapInterval="10"/>

    说明:当滑动条滑动时，将会改变滑动条的数值，因为我们将<mx:Label>的fontSize属性值和滑动条的数值进行了绑定，
    所以滑动条变化后的数值将会作为<mx:Label>的fontSize属性值。

  <2>方法二 : 针对MXML和ActionScript结合使用的方法。
  在组件对象的元素属性中,使用"{}"把某个ActionScript的方法的返回值作为数据源绑定到该组件对象属性上。
  同时ActionScript的这个方法的参数要使用[Bindable]绑定符号。

   例如:
    <mx:Script>
     <![CDATA[
      
      //作为方法的参数, 如果不指定[Bindable]那么参数变化后不会通知目标进行更新数据
      [Bindable]
      private var number:int;
      
      //下边调用的方法，做平方运算
      internal function square(num:int):int{
       return num * num;
      }
     ]]>
    </mx:Script>
    <mx:Label x="276" y="244" text="结果" fontSize="17" id="f_label"/>
    <!-- 这里把square方法的返回值作为数据源，而number属性作为参数进行绑定，有规则知道作为参数的number属性要使用[Bindable]进行声明，
    表明为该属性指定一个监听器(由Flex自己完成)，当属性值变化时就表示触发该事件，然后就会通知数据绑定目标进行更新操作(也是由Flex自己完成) -->
    <mx:TextInput x="323" y="249" width="113" text="{square(number)}"/>
    <!-- 这里把滑动块的值作为数据源，目标对象为通过ActionScript定义的number属性；
    当滑动条变动的时候会触发change属性指定的方法，不过这里不是方法，而是数据绑定，
    当变化时会将滑动条的值赋值给通过ActionScript定义的number属性变量 -->
    <mx:HSlider x="276" y="284" id="h_slider" minimum="1" maximum="10" change="{number = h_slider.value}"/>

   **补充关于[Bindable]的知识 :
    
    **声明的标准格式 : [Bindable(event="eventType")] 表示为添加该声明的属性(数据源)制造事件，就是说当数据源变化时，
    向事件流中制造一个事件，以便触发事件(Flex内部定义好的)去通知目标对象进行更新操作(由Flex完成)！！

    **我们上边为什么只是指定了[Bindable]呢？ ---- 因为如果不指定默认值为[Bindable(event="propertyChange")]，等价于[Bindable]，
    就是说当属性改变的时候制造一个事件，以便Flex通知目标对象进行更新操作。

   **扩展能力补充: [Bindable]不仅可以用在属性上，也可以用在getter或setter方法(2选1即可)上，也可以作用在类的声明上。

    A.作用在getter或setter方法上: 成为方法级绑定。实现的效果和[Bindable]作用在属性上差不多。

     例子:
      //1.创建一个ActionScript的类
      public class BindClass{       
       //属性处则不用进行绑定了
       private var age:int;

       //建立绑定关系
       [Bindable]
       public function get Age():int{
        return this.age;
       }       
       //属性的setter方法，[Bindable]作用在getter或setter方法中选其一即可
       public function set Age(age:int):void{
        this.age = age;
       }
      }

      //2.在MXML文件中使用BindClass类
      <mx:Script>
       <![CDATA[
        
        //定义一个类对象，供下边的MXML文件访问
        private var bc:BindClass = new BindClass();
        
        //下边调用的方法，做平方运算
        internal function square(num:int):int{
         return num * num;
        }
       ]]>
      </mx:Script>
      <mx:Label x="276" y="244" text="结果" fontSize="17" id="f_label"/>
      <!-- 因为BindClass绑定的是getter和setter方法，
      所以暴漏出来的是get或set关键字后边的部分(可以作为属性直接使用)，
      不过此时就不能直接访问BindClass类的age属性，因为并没有绑定age属性,
      下边text="{square(bc.Age)}"中的bc.Age表示调用的是get Age()方法 -->
      <mx:TextInput x="323" y="249" width="113" text="{square(bc.Age)}"/>
      <!-- change="{bc.Age = h_slider.value}"中的bc.Age表示调用的是set Age()方法-->
      <mx:HSlider x="276" y="284" id="h_slider" minimum="1" maximum="10" change="{bc.Age = h_slider.value}"/>

    B.作用在类的声明上: 称为对象(类)级别绑定，[Bindable]标签用于公有类时，
    这个类的所有public类型的变量和setter、getter方式定义的方法都可以用于绑定。

     例如:
      //1.创建一个BindClass类型,并且绑定类级别的绑定
      [Bindable]
      public class BindClass{  
       <!-- 下边的 属性 会因为定义了类级的绑定自动进行绑定 -->
       //定义成public主要使用与演示效果
       public var age:int;

       <!-- 下边的 getter或setter方法 会因为定义了类级的绑定自动进行绑定 -->
       //getter方法
       public function get Age():int{
        return this.age;
       }       
       //属性的setter方法，[Bindable]作用在getter或setter方法中选其一即可
       public function set Age(age:int):void{
        this.age = age;
       }
      }

      //2.在MXML文件中使用BindClass类: 此时就可以使用A中或第一种方法来实现了。
      <mx:Script>
       <![CDATA[
        
        //定义一个类对象，供下边的MXML文件访问
        private var bc:BindClass = new BindClass();
        
        //下边调用的方法，做平方运算
        internal function square(num:int):int{
         return num * num;
        }
       ]]>
      </mx:Script>
      //可以使用这种方案，也可以使用下边的(就是第一种方式)
      <mx:Label x="276" y="244" text="结果" fontSize="17" id="f_label"/>
      <mx:TextInput x="323" y="249" width="113" text="{square(bc.Age)}"/>
      <mx:HSlider x="276" y="284" id="h_slider" minimum="1" maximum="10" change="{bc.Age = h_slider.value}"/>
      或
      <mx:Label x="276" y="244" text="结果" fontSize="17" id="f_label"/>
      <mx:TextInput x="323" y="249" width="113" text="{square(bc.age)}"/>
      <mx:HSlider x="276" y="284" id="h_slider" minimum="1" maximum="10" change="{bc.age = h_slider.value}"/>    

  <3>方法三 : 使用<mx:Binding>标签来实现，source属性用于指定数据源，destination用于指定目标对象。该标签要和<mx:Model>标签组合使用，
  把<mx:Model>指定的数据作为<mx:Binding>的数据源。

   ** 内容补充: 标签<mx:Model>的使用,就是可以在该标签内部定义一些数据，定义形式和XML一样。
    
    例如: <!-- 标签中定义了一个<books>标签和两个兄弟标签<book> -->
     <mx:Model id=“books”>
      <books>
       <book>
        <name>FLEX教程</name>
        <author>张三</name>
       </book>
       <book>
        <name>JAVA高级编程</name>
        <author>李四</name>
       </book>
      </books>
     </mx:Model>

   ** 实现方法:
     //把上边的<mx:Model>作为数据源，这里source="books.book.name"中的books指的是<mx:Model>中的id值(该对象就表示根元素)，
     //所以books.book就是得到<books>下的所有<book>以数组的形式(第一个元素下标为0，取0的时候可以不指定下标)。
     //destination="text_name.text"则是将数据源中的数据传到目标对象上。
     <mx:Binding source="books.book.name" destination="text_name.text"/>
     //<mx:Binding source="books.book[0].name" destination="text_name.text"/>与上边的等价
     //表示目标对象
     <mx:TextInput x="276" y="135" id="text_name" fontSize="16" fontWeight="bold"/>

    //结果说明: 显示"Flex教程"

  <4>以上三种方法总结: 三种绑定的方法一般都是绑定的静态数据，就是都是在文件中准备好了的数据！！

  <5>Object对象和动态对象: ActionScript中的Object对象和Java中的有区别，在ActionScript中Object是一个动态对象，可以为对象动态指定属性。

   例如:
    var obj:Object = new Object();
    obj.name = "admin"; //动态指定属性name并为其赋值
    obj.age = 24; //动态指定age属性
    obj.address = "北京海淀区万泉庄"; //动态指定address属性

    或者: 进行初始化
    var obj:Object = {name:"admin", age:24, address:"北京海淀区万泉庄"};

   **注意:可以使用"dynamic"关键字来定义一个动态的类型，使用的时候可以向上边Object一样，可以动态创建属性。

   **说明:<mx:Model>标签运行时会被转换成ActionScript语言中的Object类型的对象，因为Object是动态对象，
   所以像source="books.book.name"这样指定数据源的时候，如果指定了错误的属性，并不会报告错误，因为是动态类型，
   如果指定错误他会动态创建这个属性，所以将会导致匪夷所思的不可预见性的错误，为此Flex内部实现的时候当把<mx:Model>转成Object的时候，
   Flex又紧接着将Object转换成了ObjectProxy类型的对象，就是去除了Object的动态类型功能的包装代理类，这样才得以上边的程序运行没有后顾之忧！！

  <6>工具类BindingUtils和动态绑定: mx.binding.utils.BindingUtils类
  (API文档中没有该类的帮助，可以从Flex Builder的帮助中查看API文档，也可在Flex Builder创建的类中按F1快捷键)
  中提供了两个静态方法来处理动态绑定！！
   
   **例子1: 需求要求动态创建一个Label对象，然后将它加入到应用程序中(相当于加入到Java Swing的Frame窗体中)。
   而之前的方法是使用MXML创建一个<mx:Label>，这样可以使用上边的方式进行绑定，而这里要求动态创建一个Label对象，
   此时就是动态绑定，要借助BindingUtils.bindProperty()方法来进行动态绑定。
   <mx:Script>
    <![CDATA[
        
     //定义一个Label类对象
     internal var label:Label = new Label();
     
     //初始化方法，运行应用程序时自动运行该方法
     internal function init():viod{
      //将动态创建的label对象添加到应用程序窗体
      this.addChild(label);
      label.x = "300"; //设置label对象的属性值
      label.y = "100";
      label.width = "200";
      label.height = "50";
      label.text = "10"; //刚开始Label中显示10这个数字
      
      //为label对象动态绑定，将滑动条的value属性和该label对象的text属性进行绑定
      BindingUtils.bindProperty(label, "text", text_show, "value");
     }
    ]]>
   </mx:Script>
   <mx:HSlider id="text_show" x="276" y="284" minimum="20" maximum="40" snapInterval="10"/>

   **例子2: BindingUtils.bindSetter()方法的应用。修改上边的例子！
   BindingUtils.bindProperty(label, "text", text_show, "value");修改成
   BindingUtils.bindSetter(setTxt, text_show, "value");意思是当text_show组件对象的value属性值发生改变时，要调用setTxt()方法，
   调用的同时将text_show对象的最新value属性的值作为参数传给setTxt()方法。

   除了修改上边语句外，还要添加一个setter方法，其实该方法的定义名称可以随意，不过这里为了见名知意，就定义成了setTxt()名称!!
   internal function setTxt(txt:String):void{
    label.text = txt; //将Label对象的text属性值等于最新版本的text_show的value属性值
   }

 9.Flex的样式(style): 使用方式有多种。
  
  <1>直接使用CSS文件，系统默认使用default.css文件。
  
   引入格式 : <mx:Style source="要引入的CSS文件的路径名(相对/绝对都行)"/>

  <2>使用Flex的视图编辑器模式，直接操作组件对象的style样式！！

  <3>如果是动态创建的组件对象，那么可以通过调用对象的setStyle()方法来设置样式，也可通过getStyle()方法得到样式！！

  <4>使用StyleManager类来操作样式: 结合CSSStyleDeclaration类一起使用！！

   例如: 
    <mx:Script>
     <![CDATA[
      
      internal function init():void{
       //创建一个样式对象
       var cs:CSSStyleDeclaration = new CSSStyleDeclaration("myCssStyle");
       cs.setStyle("color", "#000000"); //设置样式对象的颜色属性为#000000色
       //将cs样式对象作用与程序中所有Panel类型的对象上
       StyleManager.setStyleDeclaration("Panel", cs, true);
      }
     ]]>
    </mx:Script>
   
   *说明: MXML文件中的标签引用CSS文件中定义的样式的时候一般使用styleName属性来引用！！

  <5>定义CSS文件的格式:
   
   /* 全局样式，使用global关键字定义，就是对所有具有以下指定的属性(像borderColor属性)的标签，它们的对应属性值都是#767473 */
   global
   {
    borderColor: #767473; 
   }
   **注意:在ActionScript代码中可以使用
   var globaalStyle:CSSStyleDeclaration = StyleManager.getStyleDeclaration("global");来得到全局样式对象，
   在程序中可以动态的修改对应的样式属性的值！！
   
   /* 作用于<mx:Application>标签及其子标签的样式 */
   Application
   {
    borderStyle: "none";
   }

   /*
    可以使用MXML文件中标签的styleName属性来引入这个样式，例如，styleName="comboDropDown"其中"."不用写入
    类似于HTML中CSS中的类选择方式，HTML标签中可以使用class属性来指定这种类型的CSS样式定义！！
   */
   .comboDropDown
   {
    backgroundAlpha: 0.6;
   }

 10.Flex的主题: 主题是一套配置完整的CSS样式风格！！Flex提供的几种主题(可以在Flex builder的帮助中以"theme"关键字搜到)文件类型都以".swc"为扩展名！！
 其实就是将CSS打成一个swc库包，打包方法有很多，可以使用Flex提供的命令行工具(compc命令，可参看以"theme"为关键字搜到的Flex Builder帮助内容)，
 也可以使用Flex Library项目对src中的内容打包成swc包进而导出！！

 *主题文件的使用:

  **方法一: 在运行应用程序的时候传入附加参数"-theme xxx.css" ; 或者，修改项目的属性，
  在"Flex Compiler"中的"additional compiler arguments"处的结尾添加"-theme xxx.css"参数。

  **方法二: 修改Flex-config.xml(在Flex安装目录的sdks/3.2.0/frameworks目录中可找到)中的<theme>标签，来达到修改设置主题的效果！！

   例如:
         <theme>
    <!-- 注意此时的CSS文件不是项目中的，而是Flex Builder中提供的，路径注意一下就可以了！！ -->
    <filename>themes/Smoke/Smoke.css</filename>
         </theme>

 *说明: 可以到Flex Builder的安装目录的sdks/3.2.0/frameworks/themes目录中拷贝Flex提供的几种主题，默认Flex使用的是"HelloClassic"主题。

 

 注意: 文章中提到的《Flex3 Component Explorer》文档可到本人的下载空间中下载获得！