欢迎来到淘文阁 - 分享文档赚钱的网站! | 帮助中心 好文档才是您的得力助手!
淘文阁 - 分享文档赚钱的网站
全部分类
  • 研究报告>
  • 管理文献>
  • 标准材料>
  • 技术资料>
  • 教育专区>
  • 应用文书>
  • 生活休闲>
  • 考试试题>
  • pptx模板>
  • 工商注册>
  • 期刊短文>
  • 图片设计>
  • ImageVerifierCode 换一换

    网页设计与制作-13(续) flash基础动画制作.ppt

    • 资源ID:67202441       资源大小:3.32MB        全文页数:57页
    • 资源格式: PPT        下载积分:16金币
    快捷下载 游客一键下载
    会员登录下载
    微信登录下载
    三方登录下载: 微信开放平台登录   QQ登录  
    二维码
    微信扫一扫登录
    下载资源需要16金币
    邮箱/手机:
    温馨提示:
    快捷下载时,用户名和密码都是您填写的邮箱或者手机号,方便查询和重复下载(系统自动生成)。
    如填写123,账号就是123,密码也是123。
    支付方式: 支付宝    微信支付   
    验证码:   换一换

     
    账号:
    密码:
    验证码:   换一换
      忘记密码?
        
    友情提示
    2、PDF文件下载后,可能会被浏览器默认打开,此种情况可以点击浏览器菜单,保存网页到桌面,就可以正常下载了。
    3、本站不支持迅雷下载,请使用电脑自带的IE浏览器,或者360浏览器、谷歌浏览器下载即可。
    4、本站资源下载后的文档和图纸-无水印,预览文档经过压缩,下载后原文更清晰。
    5、试题试卷类文档,如果标题没有明确说明有答案则都视为没有答案,请知晓。

    网页设计与制作-13(续) flash基础动画制作.ppt

    1 基础动画掌握逐帧动画、形状补间动画和运动补间动画的制作方法,以及遮罩层和引导层的使用,并能够制作出简单的动画。本例将制作红点线框勾边的中空文字,如图3-1 所示。通过本例的学习,读者应掌握如何改变文档大小,以及 (文字工具)和 (墨水瓶工具)的使用方法。1.1 线框文字要点:图3-1 线框文字操作步骤:图3-2 设置文档属性图3-3 设置文本属性 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)改变文档大小。方法:执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为蓝色(#000066),文档尺寸为300 像素75 像素,如图3-2 所示,然后单击“确定”按钮。3)选择工具箱上的 (文字工具),然后在“属性”面板中设置参数如图3-3 所示,接着在工作区中单击鼠标,输入文字“CARTOON”。提示:为了便于与背景观看,可以暂时将文字颜色设置为黄色(#FFFF00)。图3-4 设置对齐参数图3-5 对齐效果 4)单击面板组缩略图中的 (对齐)按钮,调出“对齐”面板,然后勾选“与舞台对齐”选项,接着单击 (水平中齐)和 (垂直中齐)按钮,如图3-4 所示,将文字中心对齐,结果如图3-5 所示。5)执行菜单中的“修改|分离”(快捷键Ctrl+B)命令两次,将文字分离为图形。提示:第1次执行“分离”命令,将整体文字分离为单个字母,如图3-6所示;第2次执行“分离”命令,将 单个字母分离为图形,如图3-7所示。图3-6 将整体文字分离为单个字母 图3-7 将单个字母分离为图形图3-8 对文字描边后删除填充区域 6)对文字进行描边处理。方法:单击工具栏上的 (墨水瓶)工具,将颜色设为绿色(#00CC00),然后对文字进行描边。最后按键盘上的Delete键删除填充区域,结果如图3-8 所示。提示:字母“A”、“R”、“O”的内边界也需要单击,否则内部边界将不会被加上边框。7)对描边线段进行处理。方法:选择工具箱上的 (选择工具),框选所有的文字,然后在“属性”面板中单击 (编辑笔触样式)按钮,如图3-9 所示。接着在弹出的“笔触样式”对话框中设置参数,如图3-10 所示,再单击“确定”按钮,结果如图3-11 所示。提示:通过该对话框可以得到多种不同线型的边框。8)执行菜单中的“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,即可看到效果。图3-9 单击“编辑笔触样式”按钮图3-10 对描边线段进行处理图3-11 对描边线段处理后的效果 本例将制作色彩渐变的文字,如图3-12 所示。通过本例的学习,读者掌握如何改变背景颜色,以及 (文字工具)、(颜料桶工具)和 (墨水瓶工具)的使用方法。1.2 彩虹文字要点:图3-12 彩虹文字 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)改变文档大小。方法:执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为蓝色(#000066),文档尺寸为450 像素75 像素,如图3-13 所示,然后单击“确定”按钮。操作步骤:图3-13 设置文档属性提示:如果需要以后新建文件的背景色继承深蓝色的属性,可以单击“设为默认值”按钮。3)选择工具箱上的 (文字工具),设置参数如图3-14 所示,然后在工作区中单击鼠标,输入文字“动漫游戏产业”。图3-14 设置文本属性图3-16 填充文字 4)利用“对齐”面板,将文字中心对齐,结果如图3-15 所示。7)此时,填充是针对每一个字母进行的,这是不正确的。为了解决这个问题,需要选择 (颜料桶工具)对文字进行再次填充,结果如图3-17 所示。图3-15 将文字中心对齐 5)执行菜单中的“修改|分离”(快捷键Ctrl+B)命令两次,将文字分离为图形。6)选择工具箱上的 (颜料桶工具),设置填充色为 ,然后对文字进行填充,结果如图3-16 所示。图3-17 对文字进行再次填充 8)调整渐变色的方向。方法:选择工具箱上的 (渐变变形工具),在工作区中单击文字,这时,在文字左、右两方将出现两条竖线,如图3-18 所示。9)将鼠标拖动到右上方的圆圈处,此时光标将变成4 个旋转的小箭头,然后按住鼠标并将它向上拖动,如图3-19 所示。图3-18 利用渐变变形工具单击文字图3-19 调整文字渐变方向 10)选择工具箱上的 (墨水瓶工具),设置填充色为白色,然后对每个文字边缘进行描边处理,结果如图3-20 所示。图3-20 对每个文字边缘进行描边处理后的效果 11)执行菜单中“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,即可看到效果。本例将制作具有霓虹灯效果的文字,如图3-21 所示。通过本例的学习,读者应掌握将线条转换为可填充区域和柔化填充边缘的方法。1.3 霓虹灯文字要点:图3-21 霓虹灯文字 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为深蓝色(#000066),文档尺寸为550 像素300 像素,如图3-22 所示,然后单击“确定”按钮。操作步骤:图3-22 设置文档属性 3)选择工具箱上的 (文字工具),然后在“属性”面板中设置字体为“汉仪大黑简”、大小为90.0,文字颜色为红色(#FF0000),如图3-23 所示,接着在工作区中单击鼠标,输入文字“奇妙小世界”。4)利用“对齐”面板,将文字中心对齐,结果如图3-24 所示。图3-23 设置文本属性图3-24 输入文字 5)执行菜单中的“修改|分离”(快捷键Ctrl+B)命令两次,将文字分离为图形。6)对文字进行描边处理。方法:选择工具箱上的 (墨水瓶工具),设置笔触颜色为明黄色(#FFFF00),然后对文字进行描边,如图3-25 所示。接着按键盘上的Delete键删除填充区域,结果如图3-26 所示。图3-25 对文字进行描边处理提示:默认情况下笔触高度为1,此时使用的是默认高度。图3-26 删除填充区域图3-27 对文字进行描边处理图3-28 删除填充区域 7)选择工具箱上的 (选择工具),框选所有明黄色外框。然后将线宽设为1,实线。接着执行菜单中的“修改|形状|将线条转换为填充”命令,将明黄色边框转换为可填充的区域。8)执行菜单中的“修改|形状|柔化填充边缘”命令,在弹出的“柔化填充边缘”对话框中设置参数,如图3-27 所示,使其向外模糊,然后单击“确定”按钮,结果如图3-28 所示。提示:在对直线、图形线框和文字边框等线条进行柔化处理前,必须先执行菜单中的“修改|形状|将线段 转换为填充”命令,将线条转换为可填充的区域。9)执行菜单中“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,即可看到文字效果。本例将用图片制作文字中的填充部分,且使文字外围是柔化的边框,如图3-29 所示。通过本例的学习,读者应掌握如何将文档与导入的图片相匹配,以及柔化填充边缘的使用方法。1.4 彩图文字要点:图3-29 彩图文字 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)执行菜单中的“文件|导入|导入到舞台”(快捷键Ctrl+R)命令,在弹出的“导入”对话框中选择配套光盘中的“素材及结果1.4 彩图文字 背景.bmp”图片,如图3-30 所示,然后单击“打开”按钮。操作步骤:图3-30 选择导入图片 3)此时,填充图片比场景要大,为了使场景与填充图片等大,需执行菜单中的“修改|文档”(快捷键Ctlr+J)命令,在弹出的如图3-31 所示的“文档属性”对话框中,单击“内容”单选按钮。然后将背景色为深蓝色(#000066),单击“确定”按钮。4)执行菜单中的“修改|分离”(快捷键Ctrl+B)命令,将图片分离成图形,如图3-32 所示。图3-31 单击“内容”图3-32 分离后效果 5)选择工具箱上的 (文本工具),然后在“属性”面板中设置字体为“Arial”、大小为150.0,文字颜色为绿色(#00FF00),如图3-33所示,接着在工作区中单击鼠标。输入文字“Adobe”,如图3-34 所示。6)将文字移到图片以外,然后执行菜单中的“修改|分离”(快捷键Ctrl+B)命令两次,将文字分离为图形,结果如图3-35 所示。图3-34 输入文字图3-33 设置文本参数提示:将文字分离成图形的目的是为了与分离成图形的图片进行计算,以便删除不需要的部分。图3-35 将文字分离为图形 7)执行菜单中的“修改|形状|柔化填充边缘”命令,在弹出的“柔化填充边缘”对话框中设置参数,如图3-36 所示,使其向外模糊,然后单击“确定”按钮。8)配合键盘上的Shift键,选中所有文字中的填充部分,然后按键盘上的Delete键删除,结果如图3-37 所示。图3-36 设置“柔化填充边缘”参数 图3-37 删除填充部分 9)将文字移到图片中,如图3-38 所示。然后按住键盘上的Shift键,点选图片文字外围部分和字母中多余的部分,按Delete键将它们删除,最终结果如图3-39 所示。图3-38 将文字移到图片中 图3-39 删除多余部分提示:在将文字线框移到图片中之前,必须先将图片分离成图形,否则文字将被放置到图片的下层,从而 无法看到。另外,文字不能直接写入图片中,如果直接在图片中编辑文字,则文字的填充部分被删 除后将显示蓝色的背景,而不显示彩色图片。本例将制作花朵盛开的效果,如图3-55 所示。通过本例的学习,读者应掌握对图形制作变形过渡动画的方法。1.5 盛开的花朵要点:图3-55 盛开的花朵 操作步骤:图3-56 将圆形中心对齐工作区中心 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为浅绿色(#00FF00),然后单击“确定”按钮。3)选择工具箱上的 (椭圆工具),设置笔触颜色为 ,填充为深蓝色(#00FF00),然后按住键盘上的Shift键,在工作区中创建一个“宽”和“高”均为160 的正圆形。提示:不用激活“图形绘制”按钮。4)执行菜单中的“窗口对齐”(快捷键Ctrl+K)命令,调出“对齐”面板,将圆形中心对齐工作区中心,结果如图3-56 所示。5)右击时间轴的第30 帧,在弹出菜单中选择“插入关键帧”(快捷键F6)命令,在第20 帧插入一个关键帧,时间轴如图3-57 所示。图3-57 在第20 帧插入一个关键帧 6)选择工具箱上的 (任意变形工具),调整工作区中的圆形,结果如图3-58所示。然后在“变形”面板中确认 和 均为100%,如图3-59 所示,接着在工作区中将变形后的圆形轴心点移到下方位置,如图3-60 所示。图3-58 调整圆形形状 图3-59 设置变形参数 图3-60 调整圆形轴心点位置 7)在“变形”面板中设置旋转角度为30,如图3-61 所示,然后单击 (重置选区和变形)按钮11 次,制作出花朵图形。接着利用“对齐”面板将其中心对齐,如图3-62 所示。图3-61 设置旋转角度为30 图3-62 将花朵图形中心对齐 8)在“颜色”面板中调出红-黄放射状渐变如图3-63 所示,然后填充花朵图形,结果如图3-64 所示。图3-63 在第20 帧插入一个关键帧图3-64 填充花朵图形后的效果 9)右击时间轴中“图层1”的第1 帧,从弹出的快捷菜单中选择“创建补间形状”命令,此时时间轴如图3-65 所示。图3-65 时间轴分布 10)执行菜单中的“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,打开播放器窗口,可以看到花朵盛开的效果。本例将制作彩虹文字从左旋转着运动到右方消失,然后再从右方运动到左方重现的效果,如图3-66 所示。通过本例的学习,读者掌握翻转帧、创建传统补间动画的方法。1.6 运动的文字要点:图3-66 运动的文字操作步骤:图3-67 设置文档属性 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为深蓝色(#000066),文档尺寸为550 像素250 像素,如图3-67 所示,然后单击“确定”按钮。3)选择工具箱上的 (文本工具),设置参数如图3-68 所示,然后在工作区中单击鼠标,输入文字“Flash 动画技术推动动漫产业发展”,结果如图3-69 所示。图3-68 设置文本属性图3-70 对分离为图形的文字进行填充后的效果图3-69 输入文字 4)执行菜单中的“修改|分离”(快捷键Ctrl+B)命令两次,将文字分离为图形。5)选择工具箱上的 (颜料桶工具),设置填充色为 (彩虹渐变),对文字进行填充,结果如图3-70 所示。6)执行菜单中的“修改|转换为元件”(快捷键F8)命令,在弹出的“转换为元件”对话框中设置参数,如图3-71 所示,然后单击“确定”按钮,结果如图3-72 所示。图3-71 “转换为元件”对话框 提示:将文字转换为元件的目的是为了后面创建传统补间动画。图3-72 转换为元件效果 7)右击“图层1”的第30 帧,从弹出的菜单中选择“插入关键帧”(快捷键F6)命令,插入一个关键帧。然后利用 (选择工具)向右移动text 元件,如图3-73 所示。8)右击时间轴中“图层1”的第1 帧,从弹出菜单中选择“创建传统补间”命令,此时时间轴如图3-74 所示。下面按键盘上的Enter键预览动画,可以看到文字从左向右运动。图3-73 在第30 帧向右移动文本 图3-74 创建传统补间动画 9)制作文字旋转效果。方法:单击“图层1”的第1 帧,然后在“属性”面板中设置参数,如图3-75 所示。10)制作文字在30 帧消失效果。方法:单击“图层1”的第30 帧,然后选择工作区中的文字,在“属性”面板中设置Alpha 的数值为0%,如图3-76 所示。图3-75 设置第1 帧的属性 图3-76 设置第30 帧的属性 11)制作文字从右往左逐渐显现的效果。方法:选择“图层1”,从而选中该层上的所有帧,然后单击鼠标右键,从弹出的快捷菜单中选择“复制帧”命令。接着单击时间轴中的 (插入图层)按钮,新建一个“图层2”,再右键单击“图层2”的第30 帧,从弹出的快捷菜单中选择“粘贴帧”命令,此时时间轴分布如图3-77 所示。图3-77 时间轴分布 12)同时选择“图层2”第30 59 帧,然后右击,从弹出的快捷菜单中选择“翻转帧”命令。此时按键盘上的Enter键预览动画,可以看到文字从右向左直线运动并逐渐显现的效果。13)至此,运动的文字制作完毕。下面执行菜单中的“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,打开播放器窗口,即可看到文字从左旋转着向右运动并逐渐消失,然后又从右向左直线运动并逐渐显现的效果。本例将制作小球落下时加速,弹起时减速的效果,如图3-78 所示。通过本例的学习,读者应掌握利用“缓动”值来调整动画中加速和减速的方法。1.7 弹跳的小球要点:图3-78 弹跳的小球加速减速操作步骤:图3-79 绘制正圆形图3-80 转换为ball 元件 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)选择工具箱上的 (椭圆工具),设置笔触颜色为,填充色为绿-黑放射状渐变,然后配合键盘上的Shift键在工作区中绘制一个正圆形,如图3-79 所示。3)选中小球,执行菜单中的“修改|转换为元件”(快捷键F8)命令,在弹出的“转换为元件”对话框中设置参数,如图3-80 所示,然后单击“确定”按钮。4)在工作区中调整小球的位置如图3-81所示。然后分别右击“图层1”的第5帧和第10帧,从弹出的快捷菜单中选择“插入关键帧”(快捷键F6)命令,插入两个关键帧。接着调整第5 帧中小球的位置,如图3-82 所示。图3-83 时间轴分布图3-81 调整小球的位置图3-82 调整第5 帧中小球的位置 5)选择时间轴中的“图层1”,然后在右侧帧控制区中单击右键,从弹出的快捷菜单中选择“创建传统补间”命令,此时时间轴分布如图3-83所示。6)按键盘上的Enter预览动画,会发现此时小球的运动是匀速的,不符合“落下时加速,弹起时减速”的自然规律,下面就来解决这个问题。方法:单击第1 帧,在“属性”面板中设置“缓动”值为“-100”,如图3-84 所示;然后单击第5 帧,在“属性”面板中设置“缓动”值为“100”,如图3-85 所示。图3-84 在第1 帧设置缓动值为“-100”图3-85 在第5 帧设置缓动值为“100”7)至此,整个动画制作完成。执行菜单中的“控制|测试影片|测试”(快捷键Ctrl+Enter)命令打开播放器,即可看到小球落下时加速,弹起时减速的动画效果。本例将制作红色字母A 到黄色字母B,再到蓝色字母C,再到紫色字母D,最后回到红色字母A 的字母变形动画,如图3-86 所示。通过本例的学习,读者应掌握“创建补间形状”和“创建传统补间”动画的综合应用。1.8 字母变形要点:图3-86 字母变形效果 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为浅蓝色(#3366FF),文档尺寸为550 像素400 像素,然后单击“确定”按钮。3)绘制字母外旋转的圆环。方法:选择工具箱上的 (椭圆工具),设置笔触颜色为嫩绿色(#00FF00),笔触高度为8,填充色为 ,如图3-87 所示。然后单击 (编辑笔触样式)按钮,在弹出的“笔触样式”对话框中设置参数,如图3-88 所示,单击“确定”按钮。操作步骤:图3-87 设置填充和笔触颜色 图3-88 设置笔触样式 4)在工作区中拖动出一个圆形,然后选中圆形,在“属性”面板设置大小如图3-89 所示。接着利用“对齐”面板将圆形中心对齐,结果如图3-90 所示。5)选中圆形,执行菜单中的“修改|形状|将线条转换为填充”命令,然后执行菜单中的“修改|形状|柔化填充边缘”命令,在弹出的对话框中设置参数,如图3-91 所示,再单击“确定”按钮,结果如图3-92 所示。图3-89 设置圆形大小图3-90 将圆形中心对齐图3-91 设置“柔化填充边缘”参数图3-92 “柔化填充边缘”效果 6)选中柔化后的圆圈,执行菜单中的“修改|转换为元件”(快捷键F8)命令,在弹出的对话框中输入元件的名称为“环”,如图3-93 所示,接着单击“确定”按钮,这时圆形和柔化边框被转换成了“环”图形元件。图3-93 设置圆形大小 7)右击时间轴中“图层 1”的第40 帧,在弹出菜单中选择“插入关键帧”(快捷键是F6)命令,插入关键帧。然后右击“图层 1”的第1 帧,在弹出的快捷菜单中选择“创建传统补间”命令。接着在属性面板中设置“旋转”为“顺时针”,次数为1,如图3-94 所示。8)按键盘上的Enter键预览动画,此时圆环会顺时针旋转一周。9)制作字母变形的动画。方法:单击时间轴下方的 (插入图层)按钮,在“图层 1”的上方增加一个“图层2”。10)选择工具箱上的 (文本工具),然后在“属性”面板中设置字体“系列”为“Arial”、“样式”为“Bold”、“大小”为“160”,“颜色”为红色(#FF0000),如图3-95 所示,接着在工作区中输入字母“A”,最后使用“对齐”面板将文字在水平和垂直方向上中心对齐。图3-94 设置补间动画 图3-95 设置文本属性 11)按Ctrl+B组合键,将文字分离为图形,如图3-96 所示。12)在“图层2”的第10帧处,按快捷键F7(插入空白关键帧),插入空白关键帧,如图3-97 所示。图3-96 将文字分离为图形 图3-97 第10 帧处插入空白关键帧 13)选择工具箱上的 (文本工具),在“属性”面板中设置字体“颜色”为明黄色(#FFFF00),设置其他参数与字母A 相同,然后在工作区中输入字母B。14)同理,将字母B 的中心与“环”元件中心对齐,并将它分离为图形,结果如图3-98 所示。15)分别在“图层 2”的第20、30 帧按快捷键F7(插入空白关键帧),插入空白关键帧,然后分别输入蓝色的字母“C”和紫色的字母“D”,并将它们与“环”元件的中心对齐,然后将它们分离为图形。16)右击“图层2”的第1 帧,然后从弹出的快捷菜单中选择“复制帧”命令,接着右击“图层2”的第40 帧,从弹出的快捷菜单中选择“粘贴帧”命令,结果如图3-99 所示。17)单击“图层2”,选中该层的所有帧,然后在右侧帧操作区中单击右键,从弹出的快捷菜单中选择“创建补间形状”命令,此时时间轴分布如图3-100 所示。图3-98 在第10 帧输入字母B 并分离为图形 图3-99 将“图层2”的第1 帧粘贴到第40 帧图3-100 创建形状补间 18)执行菜单中的“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,打开播放器窗口,即可看到字母变形的效果。提示:绿色的圆环必须转换为元件后才能加入旋转效果。另外,变形必须在图形之间进行,所以所有字母 都必须打碎成图形。本例将制作动画片中常见的结尾黑场动画,如图4-21 所示。通过本例的学习,读者应掌握利用“遮罩层”制作结尾黑场动画的方法。1.9 结尾黑场动画要点:图4-21 结尾黑场动画 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)执行菜单中的“修改|文档”(快捷键Ctrl+J)命令,在弹出的“文档属性”对话框中设置背景色为黑色(#000000),文档尺寸为860 像素600 像素,如图4-22 所示,然后单击“确定”按钮。操作步骤:图4-22 设置文档尺寸 3)执行菜单中的“文件|导入|导入到舞台”命令,导入配套光盘中的“素材及结果4.2 结尾黑场动画 背景.jpg”文件,并利用“对齐”面板将其居中对齐,如图4-23 所示。图4-23 将图片居中对齐图4-24 时间轴分布 4)选择“图层1”的第60 帧,按快捷键 F5,插入普通帧,此时时间轴分布如图4-24 所示。5)单击时间轴下方的 (插入图层)按钮,新建“图层2”。然后利用工具箱中的 (椭圆工具),配合Shift键,绘制一个笔触颜色为 ,填充色为绿色(#00FF00)的正圆形,接着在“属性”面板中设置其“宽”和“高”均为180,并调整位置如图4-25 所示。图4-25 绘制正圆形提示:为了便于观看圆形所在位置,可以单击“图层2”后面的颜色框,将圆形以线框的方式进行显示,如图4-26 所示。6)执行菜单中的“修改|转换为元件(快捷键F8)”命令,然后在弹出的“转换为元件”对话框中设置参数如图4-27 所示,单击“确定”按钮,将其转换为图形元件。图4-26 将圆形以线框显示图4-27 设置“转换为元件”参数 7)选择“图层2”的第35 帧,按快捷键F6,插入关键帧。8)利用工具箱中的 (任意变形工具),将第1帧的“圆形遮罩”元件放大,如图4-28所示。9)在“图层2”的第1 帧和35 帧之间单击右键,从弹出的快捷菜单中选择“创建传统补间”命令,此时时间轴分布如图4-29 所示。然后按键盘上的Enter键,播放动画,即可看到圆形从大变小的动画。图4-28 在第1 帧将圆形元件放大图4-29 时间轴分布 10)右击“图层2”,从弹出的快捷菜单中选择“遮罩层”命令,此时时间轴分布如图4-30 所示。图4-30 时间轴分布 11)按键盘上的Enter键,播放动画,即可看到图片可视区域逐渐变小的效果。12)至此,本例制作完成。执行菜单中的“控制|测试影片|测试”(快捷键 Ctrl+Enter)命令,即可观看到遮罩动画效果。本例将制作一个沿路径运动的小球,如图4-54 所示。通过本例的学习,读者应掌握运动引导层的使用方法。1.10 引导线动画要点:图4-54 引导线动画 操作步骤:图4-55 将圆转换为ball 元件 1)启动Flash CS6 软件,新建一个Flash 文件(ActionScript 2.0)。2)选择工具箱上的 (椭圆工具),设置笔触颜色为 ,填充颜色为黑-绿径向渐变,然后在工作区中绘制正圆形。3)执行菜单中的“修改|转换为元件”命令,在弹出的“转换为元件”对话框中设置参数,如图4-55 所示,然后单击“确定”按钮。4)右击时间轴的第30 帧,在弹出的快捷菜单中选择“插入关键帧”(快捷键F6)命令,从而在第30 帧处插入一个关键帧。然后右击第1 帧,从弹出菜单中选择“创建传统补间”命令,此时时间轴分布如图4-56 所示。图4-56 时间轴分布图4-57 添加引导层 5)右击时间轴左侧的“图层1”,从弹出的快捷菜单中选择“添加传统运动引导层”命令,添加引导线,如图4-57 所示。6)选择工具箱上的 (椭圆工具),设置笔触颜色为黑色(#000000),填充颜色为,然后在工作区中绘制椭圆形,结果如图4-58 所示。7)选择工具箱上的 (选择工具),框选椭圆的下方部分,然后按键盘上的Delete键将其删除,结果如图4-59 所示。图4-58 绘制椭圆形 图4-59 删除椭圆形下方部分图4-60 在第1 帧放置小球提示:每两个椭圆间只能有一个点相连接,如果相接的不是一个点而是一条线,则小球会沿直线运动而不 是沿圆形路径运动。图4-61 在第30 帧放置小球 8)同理,绘制其余的3 个椭圆并删除下半部分。9)利用工具箱上的 (选择工具),将4 个圆相接。然后回到“图层1”,在第1 帧放置小球,如图4-60 所示。接着在第30 帧放置小球,如图4-61 所示。10)执行菜单中的“控制|测试影片|测试”(快捷键Ctrl+Enter)命令,即可看到小球依次沿4 个椭圆运动的效果。

    注意事项

    本文(网页设计与制作-13(续) flash基础动画制作.ppt)为本站会员(s****8)主动上传,淘文阁 - 分享文档赚钱的网站仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。 若此文所含内容侵犯了您的版权或隐私,请立即通知淘文阁 - 分享文档赚钱的网站(点击联系客服),我们立即给予删除!

    温馨提示:如果因为网速或其他原因下载失败请重新下载,重复下载不扣分。




    关于淘文阁 - 版权申诉 - 用户使用规则 - 积分规则 - 联系我们

    本站为文档C TO C交易模式,本站只提供存储空间、用户上传的文档直接被用户下载,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有。本站仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。若文档所含内容侵犯了您的版权或隐私,请立即通知淘文阁网,我们立即给予删除!客服QQ:136780468 微信:18945177775 电话:18904686070

    工信部备案号:黑ICP备15003705号 © 2020-2023 www.taowenge.com 淘文阁 

    收起
    展开