您好!欢迎您光临flash10.用as3语句制作遮罩效果 _迎客松B站!

体育

I

交友

I

论坛

I

会员注册

I

本站搜索

I

收藏本站

当前位置:首页 >>>fs10教程>>>flash10.用as3语句制作遮罩效果
flash10.用as3语句制作遮罩效果
发表日期:2012/9/19 0:55:00 出处:迎客松 作者:翠柏 发布人:hsb345 已被访问 4667

flash10.用as3语句制作遮罩效果 

 

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

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

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

 

 

     作前准备:

    准备2张色彩不同的图片,经过制图软件(ps、fw)处理后,规格约为550*400,保存00到指定的文件夹待用。

    制作步骤

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

图1

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


图2

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

    2.确立文档属性 默认。如图3所示:


图3

    3.导入素材到库

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


素材图1

素材图2

    4.创建影片剪辑

    (1)选择“插入-新建元件”,建立一个名为“被遮罩”的影片剪辑元件,点击确定,进入元件编辑区。就一个图层。

    选择图层1第一帧,从库中拖出素材2图片到舞台,设置其规格为550*400,全居中。如图4所示:

图4

    (2)选择“插入-新建元件”,建立一个名为“遮罩”的影片剪辑元件,点击确定,进入元件编辑区。就一个图层。

    选择图层1第一帧,用矩形工具在舞台拖一个规格为40*40的、颜色随意的、无边线的矩形。左对齐-上对齐。如图5所示:

图5

右键库中的遮罩元件,打开该影片剪辑元件的属性面板。如图6、7所示:

图6


图7

点击元件属性面板下方的“高级”按钮,打开属性链接面板,设置其参数,如图8所示:

图8

其中类(c)填写:MaskRectangle ;基类为flash.display.MovieClip:URL可随便粘贴一个网址。


    5.编辑制作场景

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

    (1)选择图片1图层第一帧,从库中拖出位图(素材1)到舞台,规格为550*400,全居中。上锁。如图9所示:

图9

    (2)选择图片2图层第一帧,从库中拖出被遮罩影片剪辑元件到舞台,规格为550*400,全居中。如图10所示:

图10

选中该实例,在属性面板填写其实例名称为:mc 。上锁。如图11所示:

图11

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

import fl.transitions.Tween;
import fl.transitions.easing.*;
var boxWidth:Number = 40;
var boxHeight:Number = 40;
var rows:Number = 10;
var columns:Number = 14;
var rectangles:Array = new Array();
var tweens:Array = new Array();
var container:Sprite = new Sprite();
addChild(container);
mc.mask = container;
for (var i=0; i < rows; i++) {
for (var j=0; j < columns; j++) {
var maskRectangle:MaskRectangle = new MaskRectangle();
maskRectangle.x = j * boxWidth;
maskRectangle.y = i * boxWidth;
maskRectangle.scaleX = 0;
container.addChild(maskRectangle);
rectangles.push(maskRectangle);
        }
}
var timer = new Timer(35,rectangles.length);
timer.addEventListener(TimerEvent.TIMER, animateMask);
timer.start();
function animateMask(e:Event):void {
var rectangle = rectangles[timer.currentCount - 1];
var scaleTween:Tween = new Tween(rectangle,"scaleX",Regular.easeOut,0,1,1,true);
tweens.push(scaleTween);
}

锁定该图层。

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



图6


  7.测试存盘

    *说明:

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

    2.遮罩影片剪辑元件没有加入场景1,它是通过其属性链接的设置和场景1帧脚本来实现的。 

最终效果显示:



http://hsb345.16789.net/domName/hsb345/201021622215697433.swf

 

全屏下载

 

祝你成功!

 

进入更多教程

 

 

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



iii
(2010/3/28 12:53:00) [122.141.220.]

hao 

 发表评论:共有 1 条评论

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

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

联系电话: 联系人:翠柏

琼icp备09005167