第三讲FlashMX教程运动的技巧(二_第1页
第三讲FlashMX教程运动的技巧(二_第2页
第三讲FlashMX教程运动的技巧(二_第3页
第三讲FlashMX教程运动的技巧(二_第4页
第三讲FlashMX教程运动的技巧(二_第5页
已阅读5页,还剩3页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、第三讲Flash MX教程运动的技巧(二)名称:Flash运动技术课时:2课时(教学)2课时(实验)教学目标:掌握基本的运动命令,学习不同条件下的运动控制技术。主要内容:学习各种典型的运动效果,如直线运动、环形运动、自转运动、随意曲线路径运动等的制作方法。在Flash的动画中,各种运动效果所显示出的形式多种多样,其实归纳起来无非三种:直线运动、环形运动和自由曲线运动。掌握它们运动的基本方法,就可以常作出千变万化的运动效果来。一、直线运动直线运动是一种最基本的形式,通过图形位置的平移就可以产生这种效果,上例中我们已经使用到这种方法,这里就不再重复了。但这种运动中有一种特殊的类型就是画线的运动,较

2、为特殊,我们在下面的例子中学习使用。例一:绘制一根线段画线的方法既可以用Motiom运动也可以用Shape运动,通常情况下我们使用较多的是Shape运动,何种方法既可以绘制直线,也可以绘制斜线。1、首先新建个文档,在工具栏中选择铅笔工具,轮廓颜色为黑色,粗细随意。2、在第一帧中用铅笔工具画一个很短的线段,在第40帧按F6件复制关键帧,选择“部分选取工具”选中线段后面的节点,横向拖动,使之成为一根较长的线段。注意,这一步很重要,利用形状运动时,前后物体尽可能使用同一个复制的物体,这样可以减少运动出错的几率。尽管你也可以在第40帧创建空白关键帧,然后单独重新绘制一根较长的直线用于运动,但不建议这样

3、做,因为这必须把前后线段的坐标位置对准,否则,会产生不完全的运动效果。3、任意点选某一补间帧,在属性面板中设置运动类行为“形状”即可。斜线亦可参照这种方法绘制。二、环形轨道运动按照环形的轨道运动也是一种常见的形式,那么该如何表现这种形式呢?其实,这也是一种导引线的运动,只是略微有一些小的窍门,让我们来看一下下面的例子吧!例二:按照轨道旋转的星球1、首先选择新建文档,打开菜单修改文档命令,在弹出的对话框中把背景色改为#,其它全部使用默认值,单击“OK”关闭对话框。创建元件 2、选择插入新建元件命令,在弹出的对话框中选择创建Graphic类型元件,命名为“Star”。然后选择椭圆工具,按住Shif

4、t键的同时拖动鼠标绘制一个正圆,双击选择轮廓线并把它删除。然后重新单击选中这个圆形,随后打开“属性”面板,把它的宽和高都改为80;X轴和Y轴的坐标都改为-40(坐标的位置很重要)。3、展开“混色器”面板,选择“放射状”填充类型,在色彩渐变条上选择左侧滑块,点击颜色图标选择#FF0000,然后在色彩条的上方约70%位置单击鼠标,增加一个滑快,色彩同前,最后点击选右侧滑块,色彩同前,但在色彩的Alpha值一栏中选择0%,如图3-1所示。填充效果如图3-2。 图3-1图3-24、选择插入新建元件命令,新建影片剪辑类型元件,命名为“Starmc”。按下Ctrl+L键把元件库打开,然后把元件Star拖动

5、到舞台中。5、点击添加引导层按钮,为该图层添加一个引导层。然后选择椭圆工具绘制一个椭圆,在属性面板中,把它的宽和高都改为400X120(注意点击打开左侧的锁头标记,取消保持纵横比);X轴和Y轴的坐标分别改为-200;-60。6、使用橡皮擦工具,选择一个较小的笔触,在椭圆的最右端擦除一小截线条,使之成为开放的曲线。7、选择元件“Star”,拖动到舞台中。打开菜单“窗口设计面板变形”命令打开变形面板,键入缩放值50%。然后在属性面板中“颜色”一栏选择“色调”,色彩选择白色,不透明度80%,#,其它保持默认值。8、移动元件“Star”,使它的中心对准右侧开口的上面断点。图3-39、在时间轴上图层1第

6、40帧位置按F6键复制前面一个关键帧,然后选中这个元件在属性面板修改“色调”为#,不透明度100%。移动元件,使它的中心对准右侧开口的下面断点,效果如图3-3。10、在该层任意一个补间帧上单击,打开属性面板,设置运动类行为“动作”;其它保持默认值。11、然后重新在第20帧位置按F6键创建关键帧,选中该元件,打开变形面板,键入缩放值70%。(这样的做法可以不改变原来运动中色彩的变化,而产生大小变化)12、回到场景中,添加一个新的图层。首先选中上面的图层,从元件库中把元件“Star”拖动到场景的中心。然后选择下面的图层,把影片剪辑“Starmc”拖动到场景中,注意这个MC的中心要对准红色星球的中心

7、。13、从元件库中把“Starmc”再拖动一个到场景中,在变形面板中选择旋转145度。同样这个MC的中心也要对准红色星球的中心。14、把“Starmc”再拖动一个到场景中,在变形面板中缩放值60%,在属性面板中,设置透明度(Alpha)值为60%;同样对准红色星球的中心。完整的效果如图3-4。 图3-414、选择菜单“控制测试影片”命令,可以看到最后的运动效果了。总结:在这个例子中,主要是创建环形运动的效果,但是这种运动是设置在影片剪辑而不是在主场景中制作运动,在元件库中多次调用这个元件,表现复杂的运动效果,充分体现了作为元件的优势,明显要比在主场景中制作运动的效率高得多。此外这个例子中还应用

8、到形状大小的变化、色彩的变化以及透明度的变化方法,目的是使大家加深对于motion运动所支持的形式的理解。三、圆周运动圆周运动同样是Flash中最常用的运动形式,基本的控制在属性面板中就可以完成,我们在篮球运动的例子中就已经应用过,但那是对标准圆形物体的应用,如果面对的是一些异形呢?下面的例子中,我们通过制作一块秒表来观察它们的不同之处。例三:秒表1、首先新建个文档。创建表盘元件2、选择插入新建元件命令,在弹出的对话框中选择创建Graphic类型元件,命名为“表盘”。然后选择椭圆工具,按住Shift键的同时拖动鼠标绘制一个正圆,在属性面板,把它的宽和高都改为210;X轴和Y轴的坐标都改为-10

9、5;轮廓为深灰色1点细实线。3、重新选中填充区域,而后展开“混色器”面板,选择“放射状”填充类型,在色彩渐变条上选择左侧滑块,点击颜色图标选择白色,然后在色彩条的上方约95%位置单击鼠标,增加一个滑快,色彩同前,最后点击选右侧滑块,色彩为#,如图3-5所示。填充效果如图3-6。图3-5图3-64、双击选中刚才创建的圆形,按Ctrl+C键拷贝,然后添加一个新图层2,选中第1帧,按Ctrl+Shift+V键粘贴到相同的位置,接着在变形面板中,等比收缩到95%,最后填充单色浅灰。5、按Ctrl+C键拷贝这个圆,和步骤4一样新建一个图层3并把它粘贴进去,再次缩小到95%。6、再次创建一个新的图层4,选

10、择矩形工具绘制一个宽和高为6X12的矩形,填充深灰色#。然后用鼠标分别单击选择上边和左边两段轮廓线,把轮廓线颜色改为白色。最后,重新选中这个完整的矩形,按F8键转换为元件,命名为“刻度”;类型为“图形”。7、重新选中这个元件,按Ctrl+D键再制六个,其中五个在变形面板中分别旋转30、60、90、120、150度,第六个使用修改变形垂直翻转命令,然后分别把它们排列在半圆的路径上。8、用箭头工具框选左侧5元件(12点、6点位置上的除外),按Ctrl+D键再制,然后使用修改变形水平翻转命令,最后把它们排到圆的另一半位置上,效果如图3-7。图3-7图3-89、创建一个新的图层5,选择文字工具,首先在

11、属性面板中选择“静态文本”,然后分别键入12、3、6、9四个数字,12点;黑色加粗;Timesnewroma字体。最后分别排在与刻度相应的位置上。10、新添一个图层6,用矩形工具创建一个18X20的矩形进行线性渐变填充,混色器中的设置如图3-8,然后把图层顺序调到最低层。11、再次新添一个图层7,用矩形工具创建一个40X12的矩形进行线性渐变填充,效果见图3-10。12、新添图层8,用矩形工具创建一个1.5X10的矩形,进行线性渐变填充,效果如图3-9。然后按F8键转换为元件,命名为“凹槽”;类型为“图形”。图3-1013、重新选中这个元件,按Ctrl+D键再制12个,分别把最左端和最右端的凹

12、槽位置设置好,然后打开对齐面板,选择“上对齐”和“水平平均间隔”分布按钮,效果如图3-10。图3-11制作分针。制作的思路:分图层制作,利用Flash绘制图形叠加后对底图的影响造型。14、首先选择插入新建元件命令,创建Graphic类型的元件并命名为“分针”。在图层1中先用椭圆形工具绘制一个正圆,直径为30,无轮廓。15、在图层2中用矩形形工具绘制一个20X200的矩形,先用箭头工具拖动矩形的上边缘,使之成为弧线,然后用钢笔工具点击一次,出现节点编辑状态,再点击一次,增加一个节点,然后在这个节点上再点击一次,使之成为直线点。这样就出现了类似宝剑剑尖的形状。复制这个图形,缩小到30%,然后把它移

13、动到原图形的中心位置,按Delete键删除掉它。最后把它的位置和底层的圆中心对齐。解释:贝塞尔曲线工具Flash中的造型命令不十分强,绘制图形往往要结合箭头工具、部分选取工具、钢笔工具来完成。Flash中的图形是基于矢量方式创建的,通过贝塞曲线方式来建立轮廓曲线。不过,使用椭圆形、矩形绘图工具绘制出的图形不是标准的贝塞曲线,因此不能通过编辑节点改变形状,但我们可以用箭头工具在图形的边缘上拖动,使之曲线化,就成为标准的贝塞曲线,可以使用部分选取工具、钢笔工具来编辑节点了。钢笔工具是用来直接构建贝塞曲线的,它的使用方法有点繁琐,单击即可创建直线模式的节点形成直线线段,按住鼠标拖动可以创建曲线模式的

14、节点,绘制出曲线形来。对于任意的未被选取的贝塞曲线形,用钢笔工具单击一次,图形处于曲线编辑状态。在曲线上再单击一次,即可在该位置上创建一个新的曲线模式节点,在该节点上再单击一次,节点转换为直线模式,再单击一次,该节点会被删除。16、在图层3中用椭圆形工具绘制一个正圆,直径为15,无轮廓,色彩任意并把它对齐底层圆的中心位置。 图3-11图3-1217、复制图层2中的形状,回到图层1中按Ctrl+Shift+V键粘贴到相同的位置,接着复制图层3中的圆,同样按Ctrl+Shift+V键粘贴,最后按Delete键删除掉它。这样就得到一个环形。最终的形状如图3-11。18、绘制秒针元件。参照步骤1417

15、把秒针画出来,形状如图3-12。创建指针运动的影片剪辑图3-1319、选择插入新建元件命令,创建影片剪辑类型的元件“smc”。按Ctrl+L键打开元件库,把“分针”拖动到舞台上。选中这个元件,在左侧工具栏中压下“任意变形工具”按钮,然后把该元件的形变中心移动到指针下部的圆形中心,如图3-13所示。(这一步骤非常关键,否则元件旋转时会以元件的绝对中心来进行。)把元件的形变中心对准坐标原点位置。20、新建图层2,把“秒针”拖动到舞台上,按上一步骤中的操作把它的形变中心也移动到指针下部的圆形中心,并对准坐标原点位置。上下两个指针的形变中心位置应重合。21、回到图层1,在第720帧位置,按F6键复制关

16、键帧,然后选择两帧之间任意的补间帧,在属性面板中设置补间动作类型:动作;旋转:顺时针1次。22、在图层2第720帧位置,按F6键复制关键帧,设置补间动作类型:动作;旋转:顺时针60次。23、回到主场景,把图层1重命名为“表”,拖动元件“表盘”到舞台中。图3-1424、新建图层并重命名为“动画”,拖动影片剪辑“smc”到舞台中把它和表盘的元件中心对齐。25、新建图层并重命名为“透明”,制作一个玻璃的透明表盖。先用椭圆工具绘制一个覆盖表面的正圆,白色的极细线轮廓,选中填充,然后打开混色器,选择线性渐变,把左侧颜色定为白色,不透明度设置80%;把色彩渐变条上的右侧滑块移动到60%处,颜色定为白色,不

17、透明度设置0%。26、点击工具栏中的“填充变形工具”按钮,按住右上角的小圆圈标记旋转40度,如图3-14。好了,可以选择菜单“控制测试影片”命令,看看最后的运动效果了。总结:在这个例子中,前面花的笔墨很多,是为了向大家介绍在Flash中的造型方法,应用基本绘图工具的和运用贝塞曲线工具的(钢笔工具、部分选取工具),真正的运动设置却很简单,关键在于对形变中心的调整,否则,不会出现我们需要的运动效果。四、自由曲线运动使用导引线的运动适用于创建自由的曲线运动。例四:飞舞的蝴蝶1、首先新建文档,选择插入新建元件命令,新建Graphic元件并命名为“Butterfly”。2、选择文件导入导入到舞台命令,在

18、弹出的对话框中选择运动控制路径下的wmf格式文件Butterfly。(这个例子中的情况比较特殊,由于Flash本身难以绘制较为复杂的图形,我们是从外部导入一个矢量图形来应用。)这是一个蝴蝶的翅膀,如图3-15。图3-15图3-163、新建影片剪辑元件并命名为“Buttermoive_sub”。把翅膀元件拖动到舞台中,选中这个元件,在左侧工具栏中压下“任意变形工具”按钮,然后把该元件的形变中心移动到翅膀根部的位置。(这一步骤非常关键,是7.0版本中的做法,6.0的版本则直接通过设置元件中心点的位置来完成)4、分别在第7、12帧,按F6键复制关键帧。5、选中第7帧的翅膀元件,打开变形控制面板,设置宽度缩小至75%,垂直倾斜80度,如图3-16所示。6、在属性面板中分别为三个关键帧间的两段动画设置补间动画类型:“动作”,其他保持默认不变。7、新建影片剪辑元件并命名为“Buttermoive”。把MC元件“Buttermoive_sub”拖动到舞台中并旋转60度。8、新建图层2,再从库中拖出该元件制作另一半翅膀,打开变形控制面板,设置宽度缩小至77.6%,水平倾斜60度,垂直倾斜-155.7度,如图3-17所示。图3-17图3-189、新建图层3,绘制蝴蝶的身体和触须,完成的效果如图3-18所

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论