收藏本站
 
设为主页
     您的位置:首页资源库动画制作Flash教程
== 资 源 搜 索 ==
 
高级搜索
== 学 习 资 源 ==
操 作 系 统
Windows DOS
Linux Unix
Novell OS/2
办 公 软 件
Word Excel
Access Powerpoint
Outlook Wps
媒 体 处 理
网页制作 动画制作
图片处理 视频处理
媒体播放 音频处理
课件制作 其它……
网 络 工 具
网页浏览 下载工具
FTP 工具 邮件工具
网络安全 服 务 器
联络聊天 其它……
工 具 软 件
压缩工具 系统工具
文件工具 磁盘工具
病毒防治 阅读工具
测试工具 程序设计
== 素 材 资 源 ==
GIF动画 Flash动画
按钮图库 图标图库
线条图库 背景图库
创意图库 音频素材
== 教 程 下 载 ==

FLASH入门动画

幸运鸟
新闪光时代

第十三节 放大镜效果

在这一节中,我们将利用上一节学过的遮蔽来实现一个放大镜的效果。因为讲解所需的图片比较多,所以载入时间也许会长一些,还请大家多等一会儿,因为这一节的内容既重要又有趣,不学可惜了耶。上面的示例做得还不错吧,呵呵,也花了我不少时间呢。现在我就一步一步地来详细说明制作过程。

新建一个文件。按Ctrl-M把电影属性设置为525 px X 120 px,天蓝色背景。

选绘图工具栏中的文本工具,用黑体48号字选择白色在工作区中间写上“新闪光时代”五个字。略微放大这几个字到如下图所示大小,怎么放大不用我多说了吧。双击这一层文字“图层1”,将图层的名字改为“Background Text”。

           

在这一层上新建一个层,命名为“Magnified Text”,这一层将用于显示放大了的文字。还用文字工具选黑体72号字,用稍有些灰的白色在这一层仍写上“新闪光时代”五个字。颜色的选用是根据物理上光学的知识,放大后的字会损失一部分光线,所以选择稍灰暗一些的颜色。现在两层文字重叠在一起。我们的思路是当放大镜从待放大的字的左端移到右端,也就是滑过这五个字时,在放大镜里也正好同步显示这五个字,但问题是这两层中的文字不一样长度,这就需要我们在动画过程中还要稍稍向左移动这一层上的文字,使得两层中的文字起点和终点尽量接近。方法如下:

Magnified Text层里把72号字的左端移动到下图所示的位置上,使两层中的文字左端位置比较接近。

          
然后我们在Magnified Text层的第40帧里按F6生成关键帧。在Background Text层里的第40帧按F5保持第1帧的内容。回到Magnified Text层里的第40帧上,用键盘上的方向键把文字向左移动到下图所示位置上。然后在Magnified Text层的第1帧点击鼠标右键并在弹出菜单中选择创建动画动作。
     
下面我们来设置遮蔽层使放大的文字在特定的区域里才能显示。在最上面新建一个层,起名为“Mask Top Text”,如果新建层不在最上面,把它拖到最上面即可。用椭圆工具画一个不带边线的圆,代表放大镜,颜色无所谓,直径比放大层中文字要稍大一些,位置如下图所示。当设置此层为遮蔽层后,只有圆形中的被遮蔽层的内容才能被显示出来。
    
为了方便调用,用箭头工具选取圆,按F8把它转换为图形类元件。在这一层的第40帧按F6插入关键帧,并把圆向右移动到下图所示位置。用点击第1帧并通过Ctrl+F弹出帧面板设置对话框,将其中的补间动画设置为移动。在这一层上点鼠标右键,在弹出的菜单上选遮蔽(Mask)设为遮蔽层,这时下面放大的文字所在层自动成为被遮蔽层。
      

现在我们来观察一下效果。按Ctrl-Enter发现随着圆形的移动,放大的效果已经出来了。不过放大的文字下方却还可以看得到背景文字,这是不真实的,所以我们还要再改进一些。

看来我们得对最下面的背景文字也加一个遮蔽层,让代表放大镜的圆所过之处的背景文字不被显示。选择Background Text层,点新建一个层,新建的层将位于最下面的文字层上方,给它起名为“Mask Bottom Text”。

在这一层上,我们用矩形工具,以任意填充色(不要与圆的颜色相同)绘出一个不带边线的矩形,长度约为1050 px,也就是电影属性设置的长度的2倍,宽度大约110 px,把它放在如下图所示的位置上。因为这个矩形太长了,这里放不下所以缩小了一半显示。由于这个矩形所在层的缘故,它遮住了下面的背景文字层,而放大的文字层及其遮蔽层上的内容可以显示出来。

    
现在我们把放大的文字所在层隐藏起来,让编辑区里只能看见矩形和圆形。选择圆形,按Ctrl-C复制,然后把圆所在层也隐藏起来。选择矩形所在层,按Ctrl+Shift-V把圆形复制到这一层原来的位置上,按Ctrl-B把它打散,如下图所示:
然后我们用箭头工具在圆的外面拉出一个比矩形的高度要大一些的框选中矩形的一部分和整个圆,见下图。这一步的作用是使圆和矩形融合在一起。
在矩形外点一下,取消对这部分区域的选择,再一次用鼠标点选圆形,按Delete键把圆删除,得到下面所示的图形:

这是一个镂空的色带,与以前所讲不同的是,这次镂空的部分是一个图形而不是文字。而且,我们用它来作遮蔽时,有形体的部分下面的内容将正常显示,而中间被镂空的部分下的内容无法显示出来,这实际上与镂空的概念是截然相反的,但这个效果正是我们希望的。

用箭头工具拉一个大框套住全部矩形,按F8把它转换为图形类元件,以方便调用。在矩形所在层的的第40帧按F6新建一个关键帧。把这个镂空的矩形移到下图所示位置。这个位置的确定是由代表放大镜的圆的位置所决定的。我们可以对圆所在层恢复显示,让镂空的矩形中间的空洞在第40帧正好对准代表放大镜的圆。在矩形所在层的第1帧右键点击并在弹出菜单中选择创建动画动作。然后,用鼠标右键点击这一层,在弹出的菜单中选择遮蔽(Mask)

现在我们再来看一下结果,按下Ctrl-Enter发现,放大镜效果已经是非常明显的了。为了产生更好的效果,我们再来动手做一个放大镜加上去,使得效果真加逼真一些。

Ctrl-F8新建一个图形类元件。进入元件编辑画面,按下Ctrl-L打开图库窗口。从预览窗口中把圆形元件拖动在编辑区中,使它中心的十字与编辑区中心的十字重合。按下Ctrl-B把它打散,再按Ctrl-X把它剪切到剪帖板中。

我们再从预览窗口中拖一个圆形元件到编辑画面中,将它的中心与编辑区中心的十字重合,如下图一所示。在圆上点鼠标右键选比例(Scale)。拉动右下角的手柄把圆放大一点,发现圆的中心并没有移动,见下图二。按Ctrl-B把圆打散,用颜料桶工具给圆填充黑色,如图三所示。


 图一         图二         图三       

 图四         图五

然后,我们按Ctrl+Shift-V把刚才剪取的圆粘帖到原来的位置上,在图形外面点一下,如图四所示,这时两个圆已经很好地融合在一起了。点取中间浅黄色的圆,按Delete键把它删掉,就得到图五中所示的图形。如果愿意,我们还可以用墨水瓶工具给图五中的图形加上适当颜色的轮廓线。

现在,放大镜的透镜部分我们已经做好了,下面来制作手柄。还是在透镜的编辑窗口下,在另一个区域里选择矩形工具拉出一个如下图六所示的用从暗黑到黑的线性渐进色填充的矩形。然后我们用箭头工具将其下面的三条边拉出一些弧度来,见图七。在手柄上点鼠标右键选旋转(Rotate)将手柄旋转一个角度,见图八。现在我们就把手柄也做好了。如果对手柄的粗细不满意,还可以适当放缩。图九是手柄的最终样式。

                            
           图六          图七          图八          图九

把手柄移动到透镜下方适当位置处,就得到了完整的放大镜,见下图。

回到主场景,在最上面新建一个层,在这个层上把放大镜元件调入,同样在40帧插入关键帧,在第1帧创建移动动画。使从第1到第40帧里,放大镜的透镜始终与Mask Top Text层中的圆形位置重合。这样,我们的工作就基本上做完了。

为了使动画更连续,我们在第80帧插入关键帧,并制作放大镜移回的动画。这个大家自己完成吧。对了,因为电影属性中背景不够大,我们还需要按Ctrl-M把高度设置为210 px。这样一个完整的放大镜动画就全部做好了。做好后的时间轴应如下图所示。

这一节的内容比较多,不过也很有趣,所讲到的方法我们在以后的动画制作中也会经常用到。从这个示例中,大家也可以很好地体会遮蔽的用法。这里是该示例的源文件。

[上一页] [下一页]


Copyright © 2001-2002 东莞中学信息技术科 All Rights Reserved
IE4.0 or later / 800*600  For The Best View