您好!欢迎您光临flash10.用as3语句打造变形脸_迎客松B站!

体育

I

交友

I

论坛

I

会员注册

I

本站搜索

I

收藏本站

当前位置:首页 >>>fs10教程>>>flash10.用as3语句打造变形脸
flash10.用as3语句打造变形脸
发表日期:2012/9/19 16:34:00 出处:迎客松 作者:翠柏 发布人:hsb345 已被访问 1857

 

flash10.用as3语句打造变形脸

 

 

    教学目的:通过本节教学了解和掌握flash10.as3.0的脚本运用,按钮的添加,以及对动作面板、属性面板的熟悉与运用,进而制作出变形脸的动画效果。

  教学对象:本教材是针对有一定动画制作基础和对属性面板,工具箱以及动作面板有所了解的朋友们编制的,因此省略了一些步骤,还望谅解。

    教学要点:as3.0、属性面板、按钮、动作面板、as语句。

 

 

     作前准备:

    准备一张规格为400*340的mm头像图片,经过制图软件(ps、fw)处理后,保存到指定的文件夹待用。

    制作步骤

    1.启动FLASH10 软件。首先进入“欢迎”界面。如图1所示:

图1

选择“新建-flash文件(ActionScript3.0)”点击进入工作区。如图2所示:


图2

*我用的是传统版,此外还有动画、基本功能版等,那就要看你的习惯和爱好了。

    2.确立文档属性

    点击舞台外处,在属性面板点击“编辑”,打开文档属性面板,设置其尺寸400*340,其它默认。如图3所示:

 


图3

    3.导入素材到库

    选择“文件-导入-导入到库”,将你准备好的素材图片导入库中。其素材图如下:

 

素材图

    4.创建按钮元件

    选择“插入-新建元件”,建立一个名为“开始”的按钮元件,点击确定,进入元件编辑区。就一个图层。

    选择图层1第一帧(弹起),用文本工具在舞台输入:开始,字体隶属、颜色草绿、大小22,全居中。如图4所示:

 

图4

在第2帧(指针经过)插入关键帧,将该实例改为红色。如图5所示:

 

图5

在第4帧(点击)插入关键帧,用矩形工具在舞台拖一个规格约为60*30的,蓝色无边线的矩形,全居中。如图6所示:

 

图6

    5.编辑制作场景

    返回场景1,添加两个图层,共三个图层。自下而上命名为图片、按钮、as。

    (1)选择图片图层第一帧,从库中拖出mm头像(素材图)到舞台,规格为400*340,全居中。如图7所示:

图7

将舞台实例打散,用线条工具,在舞台画一条规格为400的,垂直的红色线段,点击该实例,水平中齐;再画一条规格为450的,横向的红色线段,点击该实例,垂直中齐。如图8所示:

 

图8

点击舞台实例左上部位,起麻点后,将其转换为影片剪辑元件,命名为“01”。如图9所示:

 

图9

点击01实例,在属性面板填写其实例名称为:a 。如图10所示:

 

图10

双击库中的01影片剪辑图标,进入该元件编辑区,选中舞台实例,左对齐-上对齐。如图11所示:

 

图11

点击舞台实例右上部位,起麻点后,将其转换为影片剪辑元件,命名为“02”。如图12所示:

 

图12

点击02实例,在属性面板填写其实例名称为:b 。如图13所示:

 

图13

双击库中的02影片剪辑图标,进入该元件编辑区,选中舞台实例,右对齐-上对齐。如图14所示:

 

图14

点击舞台实例左下部位,起麻点后,将其转换为影片剪辑元件,命名为“03”。如图15所示:

 

图15

点击03实例,在属性面板填写其实例名称为:c 。如图16所示:

 

图16

双击库中的03影片剪辑图标,进入该元件编辑区,选中舞台实例,左对齐-下对齐。如图17所示:

 

图17

点击舞台实例右下部位,起麻点后,将其转换为影片剪辑元件,命名为“04”。如图18所示:

 

图18

点击04实例,在属性面板填写其实例名称为:d 。如图19所示:

 

图19

双击库中的04影片剪辑图标,进入该元件编辑区,选中舞台实例,右对齐-下对齐。如图20所示:

 

图20

在第2帧插入帧,上锁。

    (2)选择按钮图层第一帧,从库中拖出“开始”按钮元件到舞台,规格不变,将其放置在图片的左下方适当位置。如图21所示:

 

图21

选中该实例,在属性面板填写其实例名称为:ks 。如图22所示:

 

图22

在第2帧插入空白关键帧,上锁。

    (3)选择as图层第一帧,按f9,打开动作面板,在as编辑区输入,如下帧指令语句:

stop();
ks.addEventListener("click",f);
function f(e:MouseEvent){
trace(e.type,e.target.name);
gotoAndPlay(2);

}

在第2帧插入空白关键帧,按f9,打开动作面板,在as编辑区输入,如下帧语句:

stage.addEventListener(MouseEvent.MOUSE_MOVE,moveH);
function moveH(evt:MouseEvent):void {
a.width =mouseX-a.x;
a.height  =mouseY-a.y;
b.width =Math.abs(mouseX-b.x);
b.height=mouseY-b.y;
c.width =mouseX-c.x;
c.height=Math.abs(mouseY-c.y);
d.width =Math.abs(mouseX-d.x);
d.height=Math.abs(mouseY-d.y);
}

锁定该图层。

    6.本作业完成后时间轴显示如图23所示:

 

图23



  7.测试存盘

    *说明:

    本教程脚本是as3语句编程,as2以下版本不适用。

 

最终效果显示:


http://www.hsb2011.com/Article/UploadFiles/201107/2011072112130525.swf

 

全屏下载

 

祝你成功!

 

进入更多教程

 

双击自动滚屏 【打印本页】 【关闭窗口
 相关评论:



a03963361934
(2011/11/26 17:49:00) [1.197.127.]

老师你好,我是生命如花,看了老师这个教程我在做这个动画的过程中,在做这个四个变脸头像的影片剪辑的时候把他们对齐之后场景1只有第一个显示,其他三个怎么都不显示呀,老师我不知道我哪一步做错了。老师能帮我分析一下吗?谢谢了。

 发表评论:共有 1 条评论

身份选择:会员 游客(游客不需要输入密码)
用 户 名: 密 码:
评论内容:
(最多评论字数:500)

迎客松B站 | 设为首页 | 加入收藏 | 联系我们 | 进入管理 | 关于站长 | 本站搜索

联系电话: 联系人:翠柏

琼icp备09005167