艺虎动画 > flash动画基础:帧动画制作

flash动画基础:帧动画制作

翼虎动漫   2010-9-12

 

 

 

在这一教程中,我们学习用铅笔工具绘制简单的线条,结合简单的AS3.0代码制作帧动画。

 

http://img.flashzhizuo.net.cn/us/2010912143230561.swf

 

1、新建Flash文件,背景黑色(因为教程用白色绘图),其它设置默认。

2、选择铅笔工具,模式平滑,笔触3,颜色随意。绘制线条动物。每一幅图完成后选中,转换为图形元件。(线条画得不准确可以用选择工具调整)

图1
sshot-01.png
图2
sshot-02.png
图3
sshot-03.png
图4
sshot-04.png
3、新建名为Animal的影片剪辑元件,选中图层1的第一帧,打开库拖入图1,第2帧插入空白关键帧,拖入图2,第3帧拖入图3,依此类推,直到12个图全部放在帧中。图5
sshot-05.png
4、返回场景1,在图层1用直线工具(按住Shift键)画一条直线,宽度同影片剪辑,左对齐,图层上锁。


5、添加图层2,从库中把Animal影片剪辑拖到舞台上,在属性面板中调整合适的大小,放在舞台左边,图层上锁。图6
sshot-06.png
6、添加as层,选中第一帧,打开动作面板输入代码:

// 变量dx表示位移

var dx:Number = 11.5;



// 注册enterFrame事件侦听器

animal_mc.addEventListener(Event.ENTER_FRAME, moveAnimal, false, 0, true);



// 定义事件侦听器响应函数

function moveAnimal(evt:Event):void  {

        

        // 当前位置加上速度

        evt.target.x += dx;

                

        // 当目标离开舞台的时候,把目标移回到左边。

        if(evt.target.x > stage.stageWidth + evt.target.width)  {

                evt.target.x = -evt.target.width;

        }        

}

7、完成,测试影片剪辑。

如果想简单一些可以抽取第1、3、7、12图组成动画,但是细节相对少一些。

演示:
/UploadTeach/201004/20100406173421484.swf

源文件附件:帧动画.rar