本文为大家介绍如何制作Flash CS3中的[*.fla]形式的的组件(Component)。这种组件和SWC组件不同，它和CS3自带的组件一样能够双击进入组件里面编辑，是
Flash CS3新增加的一种组件形态。下面我们制作一个MyButton组件为例子。
+ J1 Q( `( v+ u8 V
. h. A: t0 C, G/ e 本文转自[闪吧-AS版]。
+ [7 b/ G$ n u3 l; p* V- O0 G# f
制作步骤:
, j$ Y8 L+ I1 j8 [3 F) h
" |: M9 S3 S1 j8 p' \6 g
1、首先创建一空白的ActionScript3.0的flash
文档，然后保存
文件命名为:"FLA_ComponentX".//名称可以任意。
) O+ I7 S, G0 T+ y1 X4 e+ m1 `% ^/ @5 d; Z5 m/ R& z
2、CTRL+F8，新建一空白剪辑，取名为"Avatar"，进入编辑，第一真上我们画一矩形框(Stroke style我们选择"hairline"，最细的线条)，不用填充，一定要记得设置坐标为(0，0)，位置固定的.
+ ]' H9 W& i v, R# u: O0 J: R) m7 Y
' W6 T9 F# |" Y- k6 |1 D4 R
3、CTRL+F8，继续新建个空白剪辑，取名为"NormalSkin"，点开高级设置，把"导出ActionScript"，"导出到第一真"两项打勾，class中填入"NormalSkin"，最后把"启动9-scale缩放的引导线"选项打勾，最后确定，进入编辑，画一填充圆角矩形，设置颜色为灰色，摆放位置(0，0)，可以拖动9-scale缩放的引导线，如图对齐，作用是让圆角矩形进行所放的时候保持四个定位的角不变形，这个矩形用来做按钮的普通模式的皮肤.
: G7 Q9 m9 D, g" V b5 E0 Z0 r D5 W. o0 ?7 C- x; H8 e6 g
4、CTRL+F8，继续新建个空白剪辑，同上，取名为"OverSkin"，点开高级设置，把"导出ActionScript"，"导出到第一帧"两项打勾，class中填入"OverSkin"，最后把"启动9-scale缩放的引导线"选项打勾，最后确定，进入辑，画一填充圆角矩形，设置颜色为红色，摆放位置(0，0)，这个矩形用来做按钮的鼠标经过模式的皮肤.
1 D. G/ x0 ?" H% m' O2 ?4 P
1 Y; V0 G7 k: P! y; F 5、CTRL+F8，新建个空白剪辑(这下我们建立的就是最终的按钮组件，上面建立的都是这按钮的组成部分)，取名为"MyButton"，点开高级设置，把"导出ActionScript"，"导出到第一真"两项打勾，class中填入"MyButton"，然后确定，进入编辑，第一层取名为"avatar"，然后第一帧上我们从库中把"Avatar"元件拖放到场景中，放置到(0，0)位置，这一真的内容在我们最后运行组件的时候是看不到的，作用主要是用来控制整个组件的宽高.然后我们新建立一层，取名"skins"，在第二帧上我们把库中的"NormalSkin"和"OverSkin"组件拖进来，位置可以随意摆放，这上面的元件是我们将来使用组件的时候，双击进入能够进行设置的.
- p: n2 R. `( C( w' T6 r# L1 p# N9 {& R: z
6、点中库中的"MyButton"元件，右键菜单中选"Component Definition"(组件定义)选项，会进入一窗口，把类名填上"MyButton"，再把"diaplay in Components panel"选项打上钩，"Tool tiptext"中填入组件名称，我这里填"MyButton".这里还有设置组件的preview(预览)效果还有图标等，其他内容大家可根据需要自行设置。
4 W, w1 J$ m O
3 N, h$ H# L7 l/ q( o* f& x" }+ ?
/ q- n% g! [4 U" Z; }4 P9 q
2 Z' ?# b# B, u1 q" s) f% d6 s7 O/ N0 c" {3 B
7、到这步，我们会发现还缺少一个外部的自定义组件的代码，也就是上面"MyButton"元件连接的"MyButton"类.由于类中导入了组件类，所以我们要设置FLASH CS3的classPath(类路径)，选编辑-->参数设置-->ActionScript-->ActionScript3.0，添加一新的类搜索路径，我这里为"D:\Program Files\Adobe\
Adobe Flash CS3\en\Configuration\Component Source\ActionScript 3.0\User Interface"
; Q5 [! P x3 a0 r- N) g+ F. k. n
; m5 M7 [ I% F: d! |. l: z
大家根据各自情况设置好路径，新建ActionScript文档，填入如下代码:
复制内容到剪贴板
代码:
/************MyButton.as**************/
package{
import flash.display.*;
import flash.events.*;
import flash.system.ApplicationDomain;
import fl.core.UIComponent;
public class MyButton extends UIComponent {
private var nowSkin:MovieClip;
private var thisDomain:ApplicationDomain;
public function MyButton() {
super();
trace("MyButton");
}
override protected function draw():void {
if (nowSkin==null) {
thisDomain=loaderInfo.applicationDomain;
var classDef
try{
classDef=thisDomain.getDefinition(getNormalSkinName());}
catch(e:ReferenceError){
trace("没有在库中找到相关的类!")
return;
}
nowSkin=new classDef as MovieClip;
nowSkin.addEventListener(MouseEvent.MOUSE_OVER，mouseOverHandler);
addChild(nowSkin);
}
nowSkin.width=width;
nowSkin.height=height;
}
protected function mouseOverHandler(e:MouseEvent):void{
trace("over");
removeChild(nowSkin);
var classDef=thisDomain.getDefinition(getOverSkinName());
nowSkin=new classDef as MovieClip;
addChild(nowSkin);
nowSkin.addEventListener(MouseEvent.MOUSE_OUT，mouseOutHandler);
draw();
}
protected function mouseOutHandler(e:MouseEvent):void{
trace("out");
removeChild(nowSkin);
var classDef=thisDomain.getDefinition(getNormalSkinName());
nowSkin=new classDef as MovieClip;
addChild(nowSkin);
nowSkin.addEventListener(MouseEvent.MOUSE_OVER，mouseOverHandler);
draw();
}
protected function getNormalSkinName():String {
return "NormalSkin";
}
protected function getOverSkinName():String {
return "OverSkin";
}
}
}代码对我们建立的按钮组件进行一些设置，我这里只简单设置了鼠标经过和离开。接着保存，名为"MyButto.as"，位于我们上面建立的"FLA_ComponentX.fla"同目录下。
