网站首页 手机版
 注册 登录
您现在的位置: 畅无忧设计 >> 媒体动画 >> Flash教程 >> Flash基础 >> 正文
最新文章
· 完整把握Flash动画设计的知识体系
· Flash8与javascript集成
· 第十七课 综合应用范例―幻彩图片
· 第十六课 时间轴特效应用范例―满天花
· 第十五课 混合模式应用范例―动画片头
· 第十四课 滤镜应用范例―水波荡漾
· 第十三课 行为和行为面板
· 第十二课 在Flash中应用视频
· 第十一课 在Flash中应用声音
· 第十课 按钮元件
热门文章
 第九课 自定义缓入/缓出动画范例―
 完整把握Flash动画设计的知识体系
 第一课 Flash8 工作环境
 第十六课 时间轴特效应用范例―满天
 第十四课 滤镜应用范例―水波荡漾
 第六课 动作补间动画
 第四课 逐帧动画
 第十五课 混合模式应用范例―动画片
 第二课 Flash8基础绘图工具
 第十课 按钮元件
相关文章
第十七课 综合应用范例―幻彩图片
第十六课 时间轴特效应用范例―满天花雨
第十五课 混合模式应用范例―动画片头
第十四课 滤镜应用范例―水波荡漾
第十三课 行为和行为面板
第十二课 在Flash中应用视频
第十一课 在Flash中应用声音
第十课 按钮元件
第九课 自定义缓入/缓出动画范例―逼真弹
第八课 引导路径动画
第六课 动作补间动画
第五课 形状补间动画
第四课 逐帧动画
第三课 绘图综合练习—情人节贺卡
第二课 Flash8基础绘图工具
第一课 Flash8 工作环境
Flash基础教程专题
第七课 遮罩动画
来源:闪客启航 更新时间:2009/5/2 3:17:10 阅读次数:
字体:[ ] 我要投稿

   本节介绍了遮罩的概念、创建方法、构成遮罩和被遮罩的元素、遮罩中可以使用的动画形式、以及应用遮罩的技巧。

在Flash8.0的作品中,我们常常看到很多眩目神奇的效果,而其中不少就是用最简单的“遮罩”完成的,如水波、万花筒、百页窗、放大镜、望远镜……等等。

那么,“遮罩”如何能产生这些效果呢?

在本节,我们除了给大家介绍“遮罩”的基本知识,还结合我们的实际经验介绍一些“遮罩”的应用技巧,最后,提供二个很实用的范例,以加深对“遮罩”原理的理解。

在Flash8.0中实现“遮罩”效果有二种做法,一种是用补间动画的方法,一种是用actions指令的方法,在本节中,我们只介绍第一种做法。

1.遮罩动画的概念

(1)什么是遮罩

“遮罩”,顾名思义就是遮挡住下面的对象。

在Flash8.0中,“遮罩动画”也确实是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地,在一个遮罩动画中,“遮罩层”只有一个,“被遮罩层”可以有任意个。

(2)遮罩有什么用

在Flash8.0动画中,“遮罩”主要有2种用途,一个作用是用在整个场景或一个特定区域,使场景外的对象或特定区域外的对象不可见,另一个作用是用来遮罩住某一元件的一部分,从而实现一些特殊的效果。

2.创建遮罩的方法

(1)创建遮罩

在Flash8.0中没有一个专门的按钮来创建遮罩层,遮罩层其实是由普通图层转化的。你只要在要某个图层上单击右键,在弹出菜单中把“遮罩”前打个勾,该图层就会生成遮罩层,“层图标”就会从普通层图标变为遮罩层图标,系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为,如果你想关联更多层被遮罩,只要把这些层拖到被遮罩层下面就行了,如图3-5-1所示。

 

图3-5-1 多层遮罩动画

 

2)构成遮罩和被遮罩层的元素

遮罩层中的图形对象在播放时是看不到的,遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等,但不能使用线条,如果一定要用线条,可以将线条转化为“填充”。

被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层,可以使用按钮,影片剪辑,图形,位图,文字,线条。

3)遮罩中可以使用的动画形式

可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段,从而使遮罩动画变成一个可以施展无限想象力的创作空间。

3.应用遮罩时的技巧

  1. 遮罩层的基本原理是:能够透过该图层中的对象看到“被遮罩层”中的对象及其属性(包括它们的变形效果),但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如,我们不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。
  2. 要在场景中显示遮罩效果,可以锁定遮罩层和被遮罩层。
  3. 可以用“AS”动作语句建立遮罩,但这种情况下只能有一个“被遮罩层”,同时,不能设置_alpha属性。
  4. 不能用一个遮罩层试图遮蔽另一个遮罩层。
  5. 遮罩可以应用在gif动画上。
  6. 在制作过程中,遮罩层经常挡住下层的元件,影响视线,无法编辑,可以按下遮罩层时间轴面板的显示图层轮廓按钮,使之变成,使遮罩层只显示边框形状,在种情况下,你还可以拖动边框调整遮罩图形的外形和位置。
  7. 在被遮罩层中不能放置动态文本。

实例:红星闪闪

3-5-2 红星闪闪

 

 

知识提要

  1. 将线条转化为填充
  2. 创建遮罩动画
  3. 使用变形面板
  4. 任意变形工具中“注册点”的应用
  5. 学习使用橡皮工具中的“水笼头”工具和擦除线条

1)创建影片文档

1、设置影片文档属性

执行【文件】|【新建】命令,在弹出的面板中选择【常规】|【Flash文档】选项后,点击【确定】按钮,新建一个影片文档,在【属性】面板上设置文件大小为400*400象素,【背景色】为黑色。(在教程中,我们为了更好的显示场景中的内容,背景色设为了深蓝色),如图3-5-3所示。

 

图3-5-3 文档【属性】面板

2)创建元件

1、 创建“闪光线条元件

  执行【插入】|【新建元件】命令,新建一个图形元件,名称为“闪光线条”。选择工具栏上的直线工具,在场景中画一直线,在【属性】面板上作如图3-5-5设置。

 

图3-5-5 闪光线条的【属性】面板参数设置

 

2、 创建“闪光线条组合”元件

执行【插入】|【新建元件】命令,新建一个图形元件,名称为“闪光线条组合”,如图3-5-6所示。

图3-5-6 创建闪光线条元件

 

从库中将名为“闪光线条”的元件拖入新元件编辑窗口的场景中,在X轴上的位置为-200,Y轴为20。然后单击工具栏上的任意变形工具,此时元件的中心会出现一个小白点,它就是对象的“注册点”,用鼠标左键按住它,拖到场景的中心处松手。

图3-5-7中的“1”显示的是注册点在元件的中心时的情形,“2”显示的是注册点已拖到场景中心时的情形。

 

图3-5-7 移动注册点到场景的中心

 

然后执行【窗口】|【设计面板】|【变形】命令,打开变形面板,选中【旋转】,角度为15度,连续按下【复制并应用变形】按钮,在场景中复制出的效果如图3-5-8所示。

 

图3-5-8 变形面板及复制好的元件

 

在时间轴的关键帧上点一下,选中全部图形,执行【修改】|【分散】命令,把线条打散,再执行【修改】|【形状】|【将线条转化为填充】命令,将线条转变为形状。

3、 创建“闪光”元件

执行【插入】|【新建元件】命令,新建一个影片剪辑,名称为“闪光”,如图3-5-9所示。

图3-5-9 创建“闪光”元件

 

单击【确定】后进行“新元件编辑窗口”,接着把库里名为“闪光线条组合”的元件拖到场景中,对齐中心点,复制此元件,在第30帧处加关键帧,再回到第1帧中建立补间动作动画,【属性】面板上设置顺时针旋转一周。

然后新建一层,在第1帧中执行【编辑】|【粘贴到当前位置】命令,使二层中的“闪光线条组合”完全重合,再执行【修改】|【变形】|【水平翻转】命令,让复制过来的线条和第一层的线条方向相反,在场景中形成交叉的图形。

在第30帧处建立关键帧,在第1帧中建立动作补间动画,【属性】面板上设置逆时针旋转一周,最后将此层设为遮罩层,如图3-5-10所示。图中显示的是“闪光”元件的时间轴面板和各图层中的动画设置。

 

图3-5-10“闪光”元件编辑界面

 

4、 创建“红星”元件

执行【插入】|【新建元件】命令,新建一个图形元件,名称为“红星”。我们要在这个元件中画一个漂亮的红星,为了画好红星,我们分九步来叙述具体的画法,图3-5-11中的“1-9”的数字表示这九个步骤。

图3-5-11 红星的九步画法

 

第一步,按住shift键,从场景中心向上画一根黄色的线条,如图3-5-11中的“1”所示。

第二步,选择工具箱中的任意变形工具,在画好的线条上点一下,这里,线条的中心出现一个白色的小园点,我们叫它“注册点”。如图3-5-11中的“2”所示。

第三步,鼠标左键按住这个小白点,拖到线条的最下端,这是因为我们要让线条要以下端为中心旋转复制。如图3-5-11中“3”所示。

第四步,执行【窗口】|【设计面板】|【变形】,打开变形面板,各参数设置如图3-5-12。

按下【复制并应用变形】按钮四次,就会在场景中每隔72度复制出一根线条,五个线条的顶端构成五角星的五个顶点。如图3-5-11中的“4”所示。

 

图3-5-12 变形面板

 

第五步,用绿色线条分别连接五根线条的顶端,五角星的模样已经出来了,如图3-5-11中“5”所示。

第六步,用白色线条分别连接五角星中心和上一步连线的中点,如图3-5-11中“6”所示。

第七步,选择工具栏上的橡皮工具 ,在工具栏下面的选项中选择“水笼头”工具,在多余的线段上点一下,去除线段,修整好的五角星如图3-5-11中的“7”所示。

第八步,用油漆筒工具给五角星上色,每个角的左右颜色可略有区别,增加立体感,如图3-5-11中的“8”所示。

第九步:再选择橡皮工具,点开旁边的小三角,在“擦除线条”前打勾,如图3-5-13所示。

 

图3-5-13 擦除线条

 

用橡皮工具擦去红星上的线条,一颗漂亮的红星就做成了,如图3-2-11中“9”所示。

技巧:在Flash8.0中,还可以用更简单的方法画红星,选择工具栏上的多角星形工具,如图3-5-14。

 

图3-5-14 多角星形工具-

 

 

图3-5-15 多角星形工具选项设置面板-

(3)创建动画

回到主场景中,把“闪光”元件拖入第二层,新建二层,第三层中拖入“红星”元件,在场景的下方写下白色的“闪客启航电影制片厂”的文字,完成后的时间帧面板及场景如图3-5-16所示。

 

图3-5-16 时间轴及场景

按Ctrl+Enter组合键,测试动画。此时,你欣赏着自己亲手做的“闪闪红星”动画,心中再回想一下“遮罩”在动画中的作用,是否已经感受到“遮罩”这一功能的神奇?

  • 上一篇文章:
  • 下一篇文章:
  • 关于我们 - 联系我们 - 广告服务 - 在线投稿 - 友情链接 - 网站地图 - 版权声明
    CopyRight 2008-2010, CWYDESIGN.COM - 畅无忧设计, Inc. All Rights Reserved
    滇ICP备09005765号