Flash 創建好的 SWC 組件，如何在 FLEX 作一UI、簡單測試

1. Open Flash Builder，然后选择File > New > Flex Project。

2. 在project name中输入FlexCharacterAnimation，然后点击Finish创建该项目。

    

3. 将CharacterAnimation.swc文件拖拽( 由檔案總管拖 )至Flex项目的 libs文件夹，

4. 建立简单用户界面来管理Flash动画

 

在下面步骤中，你将建立一个简单用户界面。 如果你以前没有使用过MXML，则这是你开始入门学习MXML及了解如何将Flash Professional项目作品并入Flex环境的绝佳机会。

按照下面步骤在Flex中建立范例用户界面：

1. 返回至Flash Builder的FlexCharacterAnimation.mxml文件。

• 注意 <s:Application> 标签，它是该应用程序的wrapper。Application标签可以包含许多 xmlns 属性，这些属性能够为在文件中引用的内容定义命名空间 (class路径)。 首先在 libs 文件夹中添加一个能够标识本地内容的新的命名空间。

2. 利用xmlns:local="*"属性更新 Application 标签，如下所示：
• <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:local="*" minWidth="955" minHeight="600">

• 这样，你可以使用MXML引用libs文件夹下的SWC文件的符号。

3. 在open和close Application 标签之间添加下列代码：

• <mx:VBox paddingLeft="50">
        <mx:HBox paddingTop="50">
  
          <local:Character id="character" x="100" y="100"/>
  
        </mx:HBox>
        <mx:HBox paddingTop="50">
          <mx:Button label="Blink" id="btn1" click="{character.blink()}"/>
  
          <mx:Button label="Look Left" id="btn2" x="100"
            click="{character.lookLeft()}"/>
  
          <mx:Button label="Look Right" id="btn3"
            click="{character.lookRight()}"/>
  
          <mx:Button label="Blink" id="btn4" click="{character.lookUp()}"/>
  
        </mx:HBox>
  </mx:VBox>