您好!欢迎您光临三龙戏珠的制作原理与方法_迎客松B站!

体育

I

交友

I

论坛

I

会员注册

I

本站搜索

I

收藏本站

当前位置:首页 >>>进阶教程>>>三龙戏珠的制作原理与方法
三龙戏珠的制作原理与方法
发表日期:2012/9/18 23:09:00 出处:迎客松 作者:翠柏 发布人:hsb345 已被访问 3889

三龙戏珠的制作原理与方法 

   

    教学目的:通过本节教学了解和掌握影片的链接属性、as影片剪辑以及相关脚本的添加,并通过此原理与操作创作出妙趣横生的动画作品。

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

    教学要点:属性链接、动作面板、as语句、Alpha及色调的变换

 

    

    作前准备:

    准备一张龙的图片,经过制图软件(ps、fw)处理后,生成龙头、龙身、龙尾三张透明图片,保存到指定的文件夹待用。

  制作步骤

    1.启动FLASH8 软件

    2.确立文档属性 设置动画尺寸为550*400,背景颜色天蓝色,其它默认,点击确定,进入场景1。 如图1所示:


图1

    3.导入素材到库

    首先,将准备好的龙头、龙身、龙尾等素材导入到库中,待用。

    4.创建影片剪辑元件

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

    选择图层1第一帧,导入或绘制一枚龙珠,规格约37*37,颜色随意。在第3、5帧插入关键帧,选中第3帧上的实例,将其打散后,用选择工具改变外环的形状。如图2所示:

图2

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

    a.选择图层1第一帧,导入或绘制一个龙头,规格约80*82,全居中。然后从库中拖出龙珠影片剪辑元件到舞台,放置在龙嘴的前边适当位置。如图3所示:

图3

    b.到库中右键该影片剪辑的图标-链接,打开链接属性面板,在链接的第2、3方格打上对号,改标识符为:lt,在URL处粘贴相关网页地址,点击确定。如图4所示:

图4

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

    a.选择图层1第一帧,导入或绘制一个龙身,规格约60*27,全居中,然后将其向右平移十几个像素。如图5所示:


图5

    b.到库中右键该影片剪辑的图标-链接,打开链接属性面板,在链接的第2、3方格打上对号,改标识符为:ls,在URL处粘贴相关网页地址,点击确定。如图6所示:

图6

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

    a.选择图层1第一帧,导入或绘制一个龙尾,规格约50*30,全居中,然后将其左端向右平移到舞台中心点。如图7所示:


图7

    b.到库中右键该影片剪辑的图标-链接,打开链接属性面板,在链接的第2、3方格打上对号,改标识符为:lw,在URL处粘贴相关网页地址,点击确定。如图8所示:

图8

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

    在该图层第1、2、3帧插入空白关键帧,点击第1帧,按f9,打开动作面板,在as编辑区输入,如下语句:

n = 23;
dx = 3;
dy = 4;
for (i = 1; i < n; i++)
{
    if (i == 1)
    {
        attachMovie("lt", "yy" + i, n + 1 - i);
        continue;
    }
    if (i == 3 || i == 13 || i == 21)
    {
        attachMovie("lw", "yy" + i, n + 1 - i);
        continue;
    }
    attachMovie("ls", "yy" + i, n + 1 - i);
}
for (i = 1; i < n; i++)
{
    if (i < 20)
    {
        this["yy" + i]._xscale = 100 + i - 2.500000E-001 * i * i;
        this["yy" + i]._yscale = 100 + i - 2.500000E-001 * i * i;
        this["yy" + i]._alpha = 100 - i * 3;
        continue;
    }
    this["yy" + i]._xscale = 30;
    this["yy" + i]._yscale = 35;
    this["yy" + i]._alpha = 15;

}

点击第2帧,按f9,打开动作面板,在as编辑区输入,如下语句:

if (dx == 0)
{
    dx = dx + (random(5) - random(5));
}
if (yy1._x + dx > 300 || yy1._x + dx < -300)
{
    dx = -dx;
}
if (yy1._y + dy > 250 || yy1._y + dy < -250)
{
    dy = -dy;
}
if (random(100) == random(100))
{
    dx = -dx;
}
if (random(100) == random(100))
{
    dy = -dy;
}
yy1._x = yy1._x + dx;
yy1._y = yy1._y + dy;
yr1 = Math.atan2(dy, dx);
yy1._rotation = yr1 * 180 / 3.141593E+000 + 180;
for (i = 2; i < n; i++)
{
    this["yr" + i] = Math.atan2(this["yy" + i]._y - this["yy" + (i - 1)]._y, this["yy" + i]._x - this["yy" + (i - 1)]._x);
    this["yy" + i]._x = this["yy" + i]._x + ((this["yy" + (i - 1)]._x - this["yy" + i]._x) / 2.200000E+000 + 1 * Math.cos(this["yr" + (i - 1)]));
    this["yy" + i]._y = this["yy" + i]._y + ((this["yy" + (i - 1)]._y - this["yy" + i]._y) / 2.200000E+000 + 1 * Math.sin(this["yr" + (i - 1)]));
    this["yy" + i]._rotation = this["yr" + i] * 180 / 3.141593E+000;
}

点击第3帧,按f9,打开动作面板,在as编辑区输入,如下指令语句:

gotoAndPlay(2);

如图9所示:

图9

   (6)选择“插入-新建元件”,建立一个名为“云彩”的影片剪辑元件(图形元件也可),点击确定,进入元件编辑区。就一个图层。

    选择图层1第一帧,导入(必须是透明的)或绘制一朵云彩,全居中。然后将其转换为影片剪辑元件。如图10所示:

图10

选中该实例,打开滤镜,设置其参数,如图11所示:

图11

    5.组织编辑场景

    返回场景1 添加四个图层,共五个图层。自下而上命名为龙1、云1、龙2、龙3、边框。

    (1)选择龙1图层第一帧,从库中拖出as影片剪辑元件到舞台,放置在舞台的左侧。上锁。

    (2)选择龙2图层第一帧,再从库中拖出as影片剪辑元件到舞台,放置在舞台的上侧。点击该实例,选择“修改-变形-顺时针旋转90度”,并在属性面板改变一下该实例的色调。上锁。

    (3)选择龙3图层第一帧,再从库中拖出as影片剪辑元件到舞台,放置在舞台的右侧。点击该实例,选择“修改-变形-水平翻转”,并在属性面板改变一下该实例的色调。上锁。如图12所示:

图12

    (4)选择云1图层第一帧,分别依次从库中拖出云彩影片剪辑元件若干到舞台,放置在舞台的不同位置,彼此可以重叠交叉,并对每朵云彩的规格进行调整,和设置其不同的透明度(Alpha),直到你满意为止。上锁。如图13所示:

图13

    (5)选择边框图层第一帧,导入或制作一个边框,规格为550*400,全居中。上锁。如图14所示


图14
 

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



图15

  7.测试存盘

    *说明:

    1.龙头、龙身、龙尾在影片剪辑中的左右位置,你可以通过测试进行调整,但必须垂直居中。

    2,你在制作中可以在边框下方再添加一个云2图层,这样会更增加龙游动中若隐若现的观感。

    3,本教程中龙的实例没有进入场景中,它是通过属性链接和as脚本来实现的。

最终效果显示:


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

 


 

全屏下载

 

祝你成功!

 

进入更多教程

 

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



如梦
(2010/3/6 23:20:00) [221.229.69.]

好漂亮!谢谢老师提供这么好的教材。


冰心
(2009/11/4 17:04:00) [124.225.45.]

好棒!活龙活现!


一个人
(2009/10/18 18:53:00) [222.248.101.]

看似非常难,其实很简单


花儿
(2009/4/10 19:36:00) [221.4.38.]

貌似挺难的~~

 发表评论:共有 4 条评论

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

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

联系电话: 联系人:翠柏

琼icp备09005167